Flex Constraint-Based Layout Source Code

Flex Constraint-Based Layout Sample Source Code: /span>


Create a file:
CanvasDemo.mxml

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundAlpha="0"> <mx:Canvas width="100%" height="100%" > <mx:Text width="100%" height="100%" fontSize="14" left="12" top="12"> <mx:text> A layout constraint is applied to this text to always position it in the upper left corner of the Canvas with a top and a left margin of 12 pixels. Another layout constraint is applied to the HBox containing the OK and Cancel buttons to always position them in the bottom right corner of the Canvas. You can resize the browser window to experiment with the behavior of this layout. </mx:text> </mx:Text> <mx:HBox right="12" bottom="12" > <mx:Button label="OK"/> <mx:Button label="Cancel"/> </mx:HBox> </mx:Canvas> </mx:Application>