1 Reply Latest reply on Dec 5, 2012 11:58 PM by BBlommers

    vertical layout of List and Button

    heartgoon Level 1

      i want to display a button just below a list,the dataProvider of the list is dynamic,i want the height of the list to be x*y if it has x items and the height of each item is y.The problem is that when the height of the list is less than the sceen height,it will be out of expect like this.can anybody help me out?

      list.jpg

      here is my code:

      ---------------------------------------------------------------

      <fx:Script>

              <![CDATA[

                  import mx.collections.ArrayCollection;

                  [Bindable]

                  private var ac:ArrayCollection = new ArrayCollection([{name:"apple"},{name:"orange"},{name:"pear"}]);

              ]]>

          </fx:Script>

          <s:VGroup width="100%" gap="0">

              <s:Label width="100%" text="list:" fontSize="20"/>

              <s:List id="lst" width="100%" dataProvider="{ac}" itemRenderer="views.myItemrenderer2"

                      horizontalScrollPolicy="auto" verticalScrollPolicy="on" >

              </s:List>

              <s:Button width="100%" label="click me"/>       

          </s:VGroup>

      ----------------------myItemrenderer.xml-------------------------------------

      <?xml version="1.0" encoding="utf-8"?>

      <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"

                      xmlns:s="library://ns.adobe.com/flex/spark"

                      xmlns:mx="library://ns.adobe.com/flex/mx">

         

         

          <s:BorderContainer width="100%" height="100%">   

              <s:HGroup width="100%" height="100%" horizontalAlign="center" verticalAlign="middle"

                        paddingLeft="5" paddingRight="5" paddingTop="5" paddingBottom="5">

                  <s:Label width="100%" height="100%" text="{data.name}" textAlign="left"  verticalAlign="middle" fontSize="20" fontWeight="bold"/>

              </s:HGroup>

          </s:BorderContainer>

      </s:ItemRenderer>

      ---------------------------------------------------------------------------