Figure 4-5. An absolutely positioned image
application window. The containerâ&#x20AC;&#x2122;s layout property must be set to absolute. All constraints are set relative to the edges of the container, not to other controls in the container. The left, right, top, bottom, horizontalCenter, and verticalCenter properties are anchors in constraint-based layouts. Example 4-6 shows the code for positioning children in a constraint-based layout using the top, bottom, left, right, horizon talCenter, and verticalCenter styles. Example 4-6. Photo.mxml <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute backgroundColor="#FFFFFF" backgroundAlpha="0"> <mx:HDividedBox width="100%" height="300"> <mx:Canvas backgroundColor="#FFFFCC" width="150" height="100%"> <mx:Label text="Adjust this section" left="15" /> </mx:Canvas> <mx:Canvas> <mx:Button label="&lt; prev" left="10" top="120"/> <mx:Image source="animals03.jpg" horizontalCenter="0" top="30"/> <mx:Label text="Photographed by Elsie Weil" horizontalCenter="0" top="250"/> <mx:Button label="next &gt;" right="10" top="120"/>
The Canvas Container (Relative Positioning) | 43