Hello, I am trying to display a component when a ComboBox selection is changed using transitions. The component is added to the layout then displayed using the Iris effect. My problem is that the UI "jumps" around when this transition is linked to the ComboBox change. It works fine when linked to a button click.
Here is an example of the issue. Click the button twice and the transition works as expected. Change the dropdown and the same transition executes but the text jumps around. Am I doing something wrong in my transition? <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:nti="Components.*" layout="absolute"> <mx:Script> <![CDATA[ public static var ENUM_Layout: Array = [ {label:"No state"}, {label:"Show state"} ]; public function doIt():void { currentState = currentState == 'showIt' ? '' : 'showIt'; } ]]> </mx:Script> <mx:states> <mx:State name="showIt"> <mx:SetProperty target="{box}" name="visible" value="true"/> <mx:SetProperty target="{box}" name="includeInLayout" value="true"/> </mx:State> </mx:states> <mx:transitions> <mx:Transition id="toNoneTrans" fromState="showIt" toState="*"> <mx:Sequence id="t1" targets="{[box]}"> <mx:Iris showTarget="false" duration="350"/> <mx:SetPropertyAction name="visible"/> <mx:SetPropertyAction name="includeInLayout"/> </mx:Sequence> </mx:Transition> <mx:Transition id="showItTrans" fromState="*" toState="showIt"> <mx:Sequence id="t2" targets="{[box]}"> <mx:SetPropertyAction name="includeInLayout"/> <mx:SetPropertyAction name="visible"/> <mx:Iris showTarget="true" duration="350"/> </mx:Sequence> </mx:Transition> </mx:transitions> <mx:HBox> <mx:VBox> <mx:Button label="Do trans" click="doIt();"/> <mx:ComboBox id="inLayout" dataProvider="{ENUM_Layout}" selectedIndex="0" change="{doIt()}"/> </mx:VBox> <mx:VBox> <mx:HBox backgroundColor="blue" width="40" height="40" id="box" visible="false" includeInLayout="false"/> <mx:Text text="Some filler text"/> </mx:VBox> </mx:HBox> </mx:Application>