Vertical Scrollbar disabled

DebbieAlger — Fri, 20 Jan 2012 11:58:58 GMT

I have a vertical scrollbar showing up in the right place, but it is disabled, kind of a tease!

this is how I have it set up..

<s:BorderContainer width="100%" height="100%"   borderVisible="false" backgroundAlpha="0"   >
   <mx:Form borderVisible="true" top="0" bottom="0" left="0" height="100%" width="100%" >
<mx:VBox height="100%"   width="100%"   verticalScrollPosition="{this.width }"   verticalScrollPolicy="on" >

blah, blah....

    </mx:VBox>
</mx:Form>
</s:BorderContainer>

thanks,

Re: Vertical Scrollbar disabled

RobertScheitlin__GISP — Sat, 11 Dec 2021 15:17:55 GMT

Debbie,

It is can of hard to say without knowing the whole context of your code but you likely need to set an explicite width not 100%

<s:BorderContainer width="100%" height="100%"   borderVisible="false" backgroundAlpha="0"   > 
   <mx:Form borderVisible="true"  top="0"  bottom="0" left="0" width="300" >    
 <mx:VBox height="100%"   width="100%"   verticalScrollPosition="{this.width }"   verticalScrollPolicy="on"  > 

blah, blah....


    </mx:VBox> 
  </mx:Form>   
</s:BorderContainer>

Also you should get use to not using a VBox and start using a VGroup now, and if you are building against the Flex SDK 4.5.1 or higher than you should also be using spark form component and not mx form anymore.

Re: Vertical Scrollbar disabled

DebbieAlger — Fri, 20 Jan 2012 12:59:21 GMT

thanks, but no that isn't it. The weird thing is that I use a vertical scrollbar in a VBox embedded lower and it works fine.
But I appreciate the info on changing over to spark components..

Re: Vertical Scrollbar disabled

RobertScheitlin__GISP — Fri, 20 Jan 2012 13:04:24 GMT

Debbie,

Are you actually using mx formItems in your form or are you just using it as a container for some reason?

Re: Vertical Scrollbar disabled

DebbieAlger — Fri, 20 Jan 2012 16:07:38 GMT

I'm not using them at all, maybe I shouldn't?? Sorry, this is my first Flex app, kinda going by the seat of my pants..
this is all the actionscript for it..

<s:BorderContainer width="100%" height="100%"   borderVisible="false" backgroundAlpha="0"   >
<mx:Form borderVisible="true" top="0" bottom="0" left="0" height="100%" width="100%" >

   
   <mx:VBox width="100%" height="25%"    paddingLeft="5" paddingRight="5" paddingTop="2" borderStyle="solid" borderVisible="true"   verticalGap="0" horizontalAlign="left"     >
       <mx:Text id="Step1"   text="{resourceManager.getString('resources', 'step1')}" width="150" textAlign="left" fontWeight="bold"/>
    <mx:HBox>
         <mx:Text text="{resourceManager.getString('resources', 'enterWatershedName')}" paddingLeft="5" paddingRight="10" paddingBottom="5"   />
         <s:TextInput id="watershedName" enabled="true"     change="{setupTool()}" />
    </mx:HBox>
   </mx:VBox>

   
   <mx:VBox width="100%" height="100%"    paddingLeft="5" paddingRight="5" paddingTop="2" borderStyle="solid" borderVisible="true"   verticalGap="0" horizontalAlign="left"     >
      <mx:Text id="Step2"   text="{resourceManager.getString('resources', 'step2')}" width="150" textAlign="left" fontWeight="bold"/>

    <s:HGroup   paddingTop="5" paddingLeft="5" verticalAlign="middle" >
     <mx:Text id="txtLabel"   text="{resourceManager.getString('resources', 'mapClick')}" width="150" textAlign="left"/>

     <mx:Button click="{verifyTool()}" id="wsButton"
          upSkin="@Embed('assets/images/icons/i_hydro.png')"
          overSkin="@Embed('assets/images/i_hydro_selected2.PNG')"
          downSkin="@Embed('assets/images/i_hydro_selected2.PNG')"
          disabledSkin="@Embed('assets/images/i_hydro_disabled.png')"
          enabled="false" buttonMode="true"   useHandCursor="true" paddingBottom="5" width="25" height="25" />

    </s:HGroup>
    <mx:HBox   horizontalAlign="left" width="100%" verticalAlign="middle" >

     <mx:Text paddingLeft="5" text="{resourceManager.getString('resources', 'scale1')}" styleName="WidgetText" />
    </mx:HBox>

    <mx:HBox horizontalAlign="left" paddingLeft="5" width="100%" verticalAlign="middle">
     <mx:Text   text="{resourceManager.getString('resources', 'scale2')}" styleName="WidgetText" />
     <mx:Text id="txtScale" text=""   styleName="WidgetText" />
    </mx:HBox>


   <mx:VBox width="100%"   paddingTop="5"   verticalGap="0" horizontalAlign="center"     >
    <mx:Text id="txtOr" text="{resourceManager.getString('resources', 'or')}" fontWeight="bold" width="100%" textAlign="center"/>
   </mx:VBox>


   
   <mx:HBox width="90%" paddingLeft="5" paddingRight="5" paddingTop="10" paddingBottom="10" >
    <mx:Text   text="{resourceManager.getString('resources', 'enterLat')} " />

    <s:TextInput    width="95"     id="txtLat" text="45.304024" textAlign="right" />
   </mx:HBox>

   <mx:HBox paddingLeft="5">
           <mx:Text text="{resourceManager.getString('resources', 'enterLong')}" />
    <s:TextInput   width="95"   id="txtLong" text="-75.848191" textAlign="right" />
   </mx:HBox>

   <s:HGroup paddingLeft="95" paddingBottom="5" paddingTop="5">
     <s:Button    id="btnSubmit" buttonMode="true"   useHandCursor="true"     click="createPoint()" enabled="{watershedName.text.length >0 && txtLat.text.length >0 && txtLong.text.length >0 }" color="0x000000" label="{resourceManager.getString('resources', 'submit')}" width="70" />
   </s:HGroup>


    </mx:VBox>

   
   <mx:Box width="100%" height="100%"   paddingLeft="10" styleName="WidgetText"    horizontalScrollPolicy="off" borderStyle="solid" borderVisible="true"   visible="{wsArray !=null && wsArray.length>0}" >

    <s:Label    text=" " />
    <s:Label id="txtDG"    paddingLeft="5" fontWeight="bold" text="{resourceManager.getString('resources', 'results')}"   />

    <s:Label id="txtHeading"     paddingLeft="5" text="{resourceManager.getString('resources', 'dgHeading')} "     />
    <mx:Canvas width="100%"     >
     
     <mx:VBox height="150" width="100%" horizontalScrollPolicy="off"   verticalScrollPosition="{this.width }" verticalScrollPolicy="auto" >

      <mx:Repeater dataProvider="{wsArray}" id="wRepeater"   >

       <mx:HBox    >
        <s:Label   text="             " />
        <s:Label   text="             " />

        <mx:Button click="remove(event )" buttonMode="true"   useHandCursor="true"   toolTip="{resourceManager.getString('resources', 'deleteWS')}"
             upSkin="@Embed('assets/images/delete.png')"
             overSkin="@Embed('assets/images/delete_selected.png')"
             downSkin="@Embed('assets/images/delete_selected.png')" width="20" height="20" />

        <s:Label   text="             " />

        <mx:Button click="Export(event )" buttonMode="true"   useHandCursor="true" toolTip="{resourceManager.getString('resources', 'exportWS')}"
             upSkin="@Embed('assets/images/export.PNG')"
             overSkin="@Embed('assets/images/export_selected.JPG')"
             downSkin="@Embed('assets/images/export_selected.JPG')" width="20" height="20" />

        <s:Label   text="             " />
        <s:Label   text="{wRepeater.currentItem.wsName}" buttonMode="true" useHandCursor="true" color="#0000FF" textDecoration="underline" fontSize="14" styleName="WidgetText" toolTip="{resourceManager.getString('resources', 'zoomWS')}" click="zoomLocation(event)"      />

       </mx:HBox>

       <mx:HBox>
        <mx:Image id="showCharacterize" click="btnShowCharacterize(event)" buttonMode="true" useHandCursor="true"   toolTip="{resourceManager.getString('resources', 'expand')}" source="{plusSign}" width="15" height="15"    />
        <s:Label   fontWeight="bold" text="{resourceManager.getString('resources', 'characterize')}" styleName="WidgetText"   visible="true" />
       </mx:HBox>


       
       <mx:VBox id="displayDatagrid"    paddingLeft="10" height="0" visible="false" >

        <mx:DataGrid id="datagrid" dataProvider="{wRepeater.currentItem.gridData}"   rowCount="5" styleName="WidgetText" itemClick="dgClick(event)"   >
         <mx:columns>
          <mx:DataGridColumn headerText="Characterization"    dataField="charType" width="125"/>
          <mx:DataGridColumn headerText="Value"    dataField="charValue" width="75"/>
          <mx:DataGridColumn headerText="Select"   dataField="charChkBox" width="50"    itemRenderer="mx.controls.CheckBox" />
         </mx:columns>
        </mx:DataGrid>

        <mx:Button   id="btnCharacterize" paddingLeft="10"   click="characterize(event)"   label="{resourceManager.getString('resources', 'selectChars')}" width="250" />
       </mx:VBox>
       <s:Label    text=" " />
      </mx:Repeater>
     </mx:VBox>
    </mx:Canvas>
   </mx:Box>

</mx:Form>
</s:BorderContainer>

Re: Vertical Scrollbar disabled

DebbieAlger — Fri, 20 Jan 2012 16:10:26 GMT

actually, Robert, I don't want to waste your time, we have decided not to worry item. I just have the outstanding item in my other scrollbar post regarding the resizing of the window.
thanks for your input on this question.

topic Re: Vertical Scrollbar disabled in ArcGIS API for Flex Questions

Vertical Scrollbar disabled

Re: Vertical Scrollbar disabled

Re: Vertical Scrollbar disabled

Re: Vertical Scrollbar disabled

Re: Vertical Scrollbar disabled

Re: Vertical Scrollbar disabled