5 Replies Latest reply on Oct 17, 2010 3:41 PM by Shongrunden

    Nested scroller not showing up

    Nielzz Level 1

      This is a sample app where the scroller does not show up. Is there any sane way of using a scroller in a constrain based layout?

       

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

       

       

       

      <s:HGroup left="0" right="0" top="0" bottom="0">                
             
      <s:Scroller left="0" right="0" top="0" bottom="0">
                 
      <s:VGroup>       
                     
      <s:BorderContainer borderColor="0" width="500" height="500"/>
                     
      <s:BorderContainer borderColor="0" width="500" height="500"/>
                     
      <s:BorderContainer borderColor="0" width="500" height="500"/>
                 
      </s:VGroup>
             
      </s:Scroller>   
      </s:HGroup>

      I am probably using the scroller wrong, so any tips on how I should be using it are much appreciated...
        • 1. Re: Nested scroller not showing up
          jfb00 Level 3

          Hi,

          Replace:

          <s:HGroup left="0" right="0" top="0" bottom="0">   
          WITH
          :
          <s:HGroup>

           

           

          Johnny

          Please rate my answer.

          • 2. Re: Nested scroller not showing up
            MartinHviid Level 2

            Hi, what are your HGroup embedded inside?

             

            The parents layout to be specific....

             

            Regards

            Martin

            • 3. Re: Nested scroller not showing up
              Nielzz Level 1

              Here is the entire app:

               

              <?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"
                                     width="500" height="400"
                                     >
                  <fx:Declarations>
                      <!-- Place non-visual elements (e.g., services, value objects) here -->
                  </fx:Declarations>
                 
                  <s:HGroup left="0" right="0" top="0" bottom="0">               
                      <s:Scroller left="0" right="0" top="0" bottom="0">
                          <s:VGroup>       
                              <s:BorderContainer borderColor="0" width="500" height="500"/>
                              <s:BorderContainer borderColor="0" width="500" height="500"/>
                              <s:BorderContainer borderColor="0" width="500" height="500"/>
                          </s:VGroup>
                      </s:Scroller>   
                  </s:HGroup>

               

              </s:WindowedApplication>

               

              And let me clearify what I'm trying to do a bit:

               

              What I am trying to accomplish is a viewport that scales with the application.

               

              I would like viewport to be 100% width, but % based layouts dont work with the scroller. So I am trying to use constraints (top,bottom,left,right)

               

              All to no success.

              • 4. Re: Nested scroller not showing up
                Nielzz Level 1

                jfb00 wrote:

                 

                Hi,

                Replace:

                <s:HGroup left="0" right="0" top="0" bottom="0">   
                WITH
                :
                <s:HGroup>

                 

                 

                Johnny

                Please rate my answer.

                No that does not work

                • 5. Re: Nested scroller not showing up
                  Shongrunden Adobe Employee

                  HorizontalLayout (HGroup) and VerticalLayout (VGroup) don't support constraint based sizing.  Use width="100%" height="100%" instead:

                  <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
                                         xmlns:s="library://ns.adobe.com/flex/spark" width="500" height="400">

                   

                      <s:HGroup left="0" right="0" top="0" bottom="0">              
                          <s:Scroller width="100%" height="100%">
                              <s:VGroup>      
                                  <s:BorderContainer borderColor="0" width="500" height="500"/>
                                  <s:BorderContainer borderColor="0" width="500" height="500"/>
                                  <s:BorderContainer borderColor="0" width="500" height="500"/>
                              </s:VGroup>
                          </s:Scroller>  
                      </s:HGroup>
                     
                  </s:WindowedApplication>