6 Replies Latest reply on Nov 25, 2010 3:29 AM by Arun Ganesh

    Scrolling not happening unless I set the height explicitly for Scroller

    flex2008 Level 3

      In my current project I need to show different lists in a tile layout.I want each of the lists to fit according to the screen size.So i dont give fixed width and heights for the list.I have used a scroller to give the scrolling.The problem is I am not getting any scrollbar and the container of the lists just expand to accomodate the list.I figure out the reason is because i have not given any fixed height anywhere.

       

      This is the sample code:

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                             xmlns:s="library://ns.adobe.com/flex/spark" 
                             xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
                             creationComplete="application1_creationCompleteHandler(event)">
          <fx:Script>
              <![CDATA[
                  import mx.collections.ArrayCollection;
                  import mx.events.FlexEvent;
                  
                  [Bindable]
                  private var ac:ArrayCollection = new ArrayCollection();
                  protected function application1_creationCompleteHandler(event:FlexEvent):void
                  {
                      var array:Array = ['1','2','3','4','5','6','7','8','9','10','11','12','13'];
                      ac.source = array;
                      dg.dataProvider = ac;
                  }
                  
              ]]>
          </fx:Script>
          <fx:Declarations>
              <!-- Place non-visual elements (e.g., services, value objects) here -->
          </fx:Declarations>
          <s:BorderContainer left="5" right="5" bottom="5" top="45"  borderStyle="solid">
              <s:DataGroup id="dg" left="10" top="35" right="10" bottom="10">
                  <s:itemRenderer>
                      <fx:Component>
                          <s:ItemRenderer autoDrawBackground="false">
                              <s:Group width="100%" height="100%">
                                  <s:Scroller left="0" top="0" right="0" bottom="0"><!-- height=120-->
                                      <s:Group clipAndEnableScrolling="true">
                                          <s:layout>
                                              <s:VerticalLayout/>
                                          </s:layout>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                          <s:Label text="Hello"/>
                                      </s:Group>
                                  </s:Scroller>
                                  </s:Group>
                          </s:ItemRenderer>
                      </fx:Component>
                  </s:itemRenderer>
                  <s:layout>
                      <s:TileLayout requestedRowCount="4" requestedColumnCount="5" rowAlign="justifyUsingHeight" columnAlign="justifyUsingWidth"
                                    />  
                  </s:layout>
              </s:DataGroup>
          </s:BorderContainer>
      </s:WindowedApplication>
      
      

       

      In the line 31,if I give  a fixed height for Scroller,scrollbar is coming.But I dont want to give  a fixed height.Is there any workaround for this problem?

       

      PS:This is not my actual code.I just used this to illustrate my problem.

       

       

      Screenshot for error:

      scroller_error.JPG

      Screenshot for needed functionality:

       

      scroller_needed.JPG