FlowLayout with child Move effect produces unwanted results

[GoogleCodeExporter]

What steps will reproduce the problem?
1. Apply a move effect to a bunch of children in a FlowBox
2. Remove one of the children, so that the others move to new positinos

What is the expected output? What do you see instead?

Each child should have an animated move via the Move effect.  The effect
plays, but the positions that the children end up in are incorrect.

This is being caused by the super.updateDisplayList in the FlowLayout
updateDisplayList method.  The BoxLayout is doing it's layout and calling
move(), then the FlowLayout is doing it's layout and calling move() again,
which is producing the unwanted behavior.

Removing the call to the super method is not enough to fix the problem. 
The super method calls Flex.flexChildWidthsProportionally (or Heights)
which goes through the children and sets their actual sizes.  This behavior
has to be implemented in the FlowLayout in order to remove the call to
super.updateDisplayList to fix the Move effect problems.

We'll probably want to re-create the flexChild... method so that it applies
to the children on a row-by-row basis.  This change should also fix the
problems with percent width so that the children in each row will be sized
correctly based on % values as well.

Original issue reported on code.google.com by darron.schall on 2 Apr 2007 at 2:57

[GoogleCodeExporter]

Original comment by darron.schall on 2 Apr 2007 at 2:57

• Added labels: Cosmetic, FlowBox, Usability

[GoogleCodeExporter]

Original comment by dmcc...@gmail.com on 26 Dec 2007 at 11:42

• Added labels: FlexLib-FlowBox
• Removed labels: FlowBox

[GoogleCodeExporter]

hi darron,
i met a problem when implemented the Flowbox,i created more than one flowbox 
instance on the stage then used code to add child into them dynamicly.but it 
blocked throwing timeout.
i did a simple demo to reproduce it,please see the attached.
the code is :

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="absolute"
                xmlns:local="*">
    <local:FlowBox id="box1"
                   x="10"
                   y="188"
                   width="226"
                   height="133"
                   borderStyle="solid"
                   borderColor="#E36410"
                   borderThickness="2"/>
    <local:FlowBox id="box2"
                   x="290"
                   y="188"
                   width="223"
                   height="138"
                   borderStyle="solid"
                   borderColor="#37E015"
                   borderThickness="2"/>
    <local:FlowBox id="box3"
                   x="562"
                   y="188"
                   width="194"
                   height="133"
                   borderStyle="solid"
                   borderColor="#179EFC"
                   borderThickness="2"/>
    <mx:Button click="add()"
               x="290"
               y="77"
               label="add"/>
    <mx:HSlider minimum="1"
                maximum="100"
                id="sl"
                liveDragging="true"
                x="353"
                y="128"
                snapInterval="1"
                value="1"/>
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.containers.BoxDirection;
            import mx.controls.Label;

            private function add():void
            {
                var arr:ArrayCollection=new ArrayCollection();
                for (var i:int=0; i < sl.value; i++)
                {
                    var s:String=String(Math.random().toFixed(int(Math.random() * 10)));
                    var lbl:Label=new Label();
                    lbl.text=s;
                    box1.addChild(lbl);

                }
                for (var i:int=0; i < sl.value; i++)
                {
                    var s:String=String(Math.random().toFixed(int(Math.random() * 10)));
                    var lbl:Label=new Label();
                    lbl.text=s;
                    box2.addChild(lbl);

                }
                for (var i:int=0; i < sl.value; i++)
                {
                    var s:String=String(Math.random().toFixed(int(Math.random() * 10)));
                    var lbl:Label=new Label();
                    lbl.text=s;
                    box3.addChild(lbl);

                }

            }
        ]]>
    </mx:Script>
    <mx:Label x="255"
              y="128"
              text="element count:"/>

</mx:Application>

Thanks very much

Waiting for you response

Fu 

Original comment by bat.ne...@gmail.com on 14 Sep 2010 at 11:56

Attachments:

• FlowBoxTest.zip

[GoogleCodeExporter]

i attached a complied swf file,please check it.

Thanks

Fu

Original comment by bat.ne...@gmail.com on 14 Sep 2010 at 11:58

Attachments:

• FlowBoxTest.swf