Friday, July 18, 2008

quick tip, includeInLayout

includeInLayout is an often overlooked property of a UIComponent. Basically it's purpose is to make on object not considered when rendering layout. Let's look at an example of a ControlBar (essentially an HBox).
<mx:ControlBar horizontalCenter="0" verticalCenter="0">
   <mx:Button label="111"/>
   <mx:Button label="222"/>
   <mx:Button label="333"/>
   <mx:Button label="444"/>
</mx:ControlBar>
Now let's take the third element and make it invisible. <mx:ControlBar horizontalCenter="0" verticalCenter="0"> <mx:Button label="111"/> <mx:Button label="222"/> <mx:Button label="333" visible="false"/> <mx:Button label="444"/> </mx:ControlBar> As you can see we now have a gap! What's the fix? includeInLayout <mx:ControlBar horizontalCenter="0" verticalCenter="0"> <mx:Button label="111"/> <mx:Button label="222"/> <mx:Button label="333" visible="false" includeInLayout="false"/> <mx:Button label="444"/> </mx:ControlBar> Perfecto! Except, just out of curiousity, what happens if we make that button visible again? <mx:ControlBar horizontalCenter="0" verticalCenter="0"> <mx:Button label="111"/> <mx:Button label="222"/> <mx:Button label="333" includeInLayout="false"/> <mx:Button label="444"/> </mx:ControlBar> :)

0 Comments:

Post a Comment

<< Home

Feed (RSS/Atom)

Contact Me

Don't put anything here: