Vertical Scrollbar disabled

[DebbieAlger]

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,

[RobertScheitlin__GISP]

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.

[DebbieAlger]

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..

[RobertScheitlin__GISP · Accepted solution]

Debbie,

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

[DebbieAlger]

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%" >   
   
   <!--================== STEP 1 BOX ======================-->
   <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>
  
   <!--============== STEP 2 BOX ===================-->
   <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>
  
   
   <!--  ====== LAT & LONG  ========== -->
   <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 &amp;&amp;  txtLat.text.length >0  &amp;&amp;  txtLong.text.length >0 }"  color="0x000000" label="{resourceManager.getString('resources', 'submit')}" width="70"  />
   </s:HGroup>    
  
  
    </mx:VBox>
   
   <!-- ==== DATAGRID with Watershed Info, invisible if nothing created   wRepeater.currentIndex,wRepeater.currentItem.wsName   visible="{wsArray !=null &amp;&amp; wsArray.length>0}"  -->
   <mx:Box  width="100%" height="100%"   paddingLeft="10" styleName="WidgetText"    horizontalScrollPolicy="off"  borderStyle="solid" borderVisible="true"   visible="{wsArray !=null &amp;&amp; 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%"     >
     <!-- 325 -->
     <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>
      
      
       <!-- Datagrid of created watersheds -->
       <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>

[DebbieAlger]

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.