4 Replies Latest reply on Apr 15, 2011 7:51 AM by eprevot123

    Flex 4 state using "basedOn" does not respect layout

    eprevot123

      Hi

      I have a problem with flex 4 states and more precisely, the basedOn attribute of state :

      I define 2 states, state2 is based on state1.

       

      then I have :

      <s:HGroup>

           <s:Label text="left" includeIn="state1"/>

           <s:Label text="right" includeIn="state2"/>

      </s:HGroup>

       

      When I am in the state2, I expect to see the first label "left" on the left, and the second label "right" on the right.

      But when currentState = state2, it seems that Flex draws first the state2 controls, then the state1 controls (since state2 is based on state1).

      So I end with my "right" label on the left and my "left" label on the right.

       

      Is that a bug ? Is there a way to avoid this ?

        • 1. Re: Flex 4 state using "basedOn" does not respect layout
          CleanCoder Level 2

          To clarify, you want your "left" Label to appear in both "state1" and "state2", and you want your "right" Label to only appear in "state2"?

           

          If that is the case, try removing the "includeIn" from your "left" Label. That way when the "right" Label is added in "state2", it will be positioned after the "left" Label, giving you the layout that you desired.

          • 2. Re: Flex 4 state using "basedOn" does not respect layout
            eprevot123 Level 2

            I gave a simplified example, but I have more than 2 states. In this example I can have an other state3 where I don't want "left" nor "right" Labels. In this case I think I need the includeIn in my "left" Label.

             

            Also, I tried to create my 2 states without the basedOn :

            <s:states>
                <s:State id="state1"/>
                <s:State id="state2"/>
            </s:states>

             

            and set my component1 includeIn = "state1", and my component2 includeIn = "state1, state2"

            For labels it's ok, but in my case, left component1 is a Datagrid. So if I do this, the datagrid is redrawn and I lost selection, scroll, etc. When I declare state2 as "basedOn" state1, my Datagrid is not redrawn, I prefer this, but then it is displayed on the right, as I described...

             

            So what is the solution ? Is this a bug in flex states ? Or do I use them the wrong way ?

            • 3. Re: Flex 4 state using "basedOn" does not respect layout
              CleanCoder Level 2

              Have you tried using stateGroups? If that doesnt work Im not sure if you can

              accomplish what you are trying to do with MXML alone. If your are comfortable

              enough doing some coding, you might try extending your component class and

              declaring your states through actionscript. When you create your states in this

              fashion you can manually assign overrides to the them, and you should be able to

              use the AddItems class to control where your components are added and the order

              that they are added in. Look into the itemsFactory property of the AddItems

              class. If you use a DeferredInstanceFromFunction class to create the instance of

              your DataGrid, it should always return the same instance of the DataGrid, so I

              would think that your selection and scroll would be unchanged.

              • 4. Re: Flex 4 state using "basedOn" does not respect layout
                eprevot123 Level 2

                I tried :

                <s:states>
                    <s:State id="state1"  stateGroups="group1"/>
                    <s:State id="state2"  stateGroups="group1"/>
                </s:states>

                 

                with :

                <s:layout>
                  <s:HorizontalLayout />
                </s:layout>

                 

                <s:DataGrid includeIn="group1" ....../>

                <s:Label includeIn="state2" ............./>

                 

                I want state1 to display my Datagrid on the left

                I want state2 to keep Datagrid on the left with its selectedItem, scroll, etc. AND display the Label on the right

                 

                But if I use stateGroups, the layout is respected but my datagird is redrawn, I loose selectedItem and scroll.

                 

                Is it really impossible using mxml states ?