4 Replies Latest reply on Apr 16, 2010 8:26 AM by Daniel Freeman

    Just want a scrollable window on a Flex component.

    Daniel Freeman Level 1

      I'm just stuck on what's probably a simple MXML solution...

       

      I have a component.  (in this case, it's an ADG - but I'm interested in a general solution).

       

      All I want, is to impose a container component around it - so that I get a scrollable window on my component.  I don't want scrollbars on my ADG.  I want scrollbars on the container component, if the ADG is bigger than it's bounds.

       

      The problem IS, if I do this kind of thing....

       

      <mx:VBox

      verticalScrollPolicy="auto"

      horizontalScrollPolicy="auto">

      <mx:AdvancedDataGrid

        verticalScrollPolicy="off"

        horizontalScrollPolicy="off"/>

      </mx:VBox>

       

      ... then the wonderful Flex framework layout mechanism imposes resizing on the ADG.  I want the ADG to be whatever size it is.  I don't want it resized to fit anything.  I just want a window on it - with auto scrollbars.

       

      How do I do that?

       

      (btw.  The reason I don't want scrollbars within the ADG component - is that I'm implementing some scaling.  Zoom in and out on the grid.  So I don't want to see scrollbars getting magnified and shrunk).

        • 1. Re: Just want a scrollable window on a Flex component.
          David_F57 Level 5

          hi,

           

          All you need to do is place it in a scroller,

           

                 <s:Scroller left="1" right="1" top="1" bottom="1">
                          <mx:AdvancedDataGrid/>
                  </s:Scroller>

           

           

          David.

          • 2. Re: Just want a scrollable window on a Flex component.
            Daniel Freeman Level 1

            Scroller won't do it.  ADG is an incompatible class.  I think it expects something that implements spark.core.IViewport.

             

            How would we have done this is mx:Halo components - prior to SDK4?  (Although an SDK4 solution would suit me fine.)

            • 3. Re: Just want a scrollable window on a Flex component.
              David_F57 Level 5

              hi,

               

               

              I don't have a lot of time at the moment to 'play', but if this works for you it might be ok, I just made sure that the grid was bigger than the scroller and it gives me the correct scrolling.

               

              <s:Scroller x="226" y="113" width="492" height="314">

              <s:Group>

              <mx:AdvancedDataGrid width="553" height="328"/>

              </s:Group>

              </s:Scroller>

              • 4. Re: Just want a scrollable window on a Flex component.
                Daniel Freeman Level 1

                I still can't prevent Flex trying to do its layout thing and resizing the ADG as the surrounding components are resized.

                 

                I'm probably going to have to write a custom component that adds children as rawChildren.  Imposes a mask layer.  And has scrollbars.

                 

                Wait a minute!  Hang on.... surely people have tried to do this before?  It's a common thing to do in a user interface.   It's the way a desktop window works usually.  A window on something - with scrollbars.  That's all I want.

                 

                If you enclose something inside a layout component, you want one of three things to happen...

                 

                1. Classic Flex layout mechanism.  The inner component is resized as the outer component is resized.  (and visa versa, if the outer component is unconstrained)

                 

                2. Or the inner component stays the same size - and the outer component behaves like a window (like your view of this webpage in your browser), cropping your view of what's inside - and with scrollbars.

                 

                3. As above, but no scrollbars.  (Can be accomplished using "includeInLayout=false").

                 

                 

                Flex MUST support option 2.  The designers of Flex must have given us a simple way to achieve it.  There MUST be a simple solution.  It MUST have been there a simple mx:halo way to accomplish this which is still applicable?  I felt so embarrassed asking this question because I thought it was going to be obvious - and something other Flex developers do every day.  I can't believe there isn't a simple and obvious solution.