转载请保持文章完整性!
本文链接地址:http://blog.desizen.com/4lone/644.html
主页:joel's blog
这个例子进行的是Tourdeflex:Containers:DividedBox
简介:
此文包括了两个部分:HDividedBox和VDividedBox.一个是横向,一个是纵向.
A DividedBox container measures and lays out its children horizontally or vertically in exactly the same way as a Box container, but it inserts draggable dividers in the gaps between the children. Users can drag any divider to resize the children on each side.
HDividedBox:
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="top" horizontalAlign="center" backgroundGradientColors="[0x000000,0x323232]" paddingTop="0" viewSourceURL="srcview/index.html"> <mx:Panel title="HDividedBox Container" layout="vertical" color="0xffffff" borderAlpha="0.15" width="500" height="240" paddingTop="10" paddingRight="10" paddingBottom="10" paddingLeft="10" horizontalAlign="center"> <mx:Text width="100%" color="0x323232" textAlign="center" text="Drag the divider side to side to resize the children."/> <mx:HDividedBox width="100%" height="100%"> <mx:Canvas label="Canvas 1" width="100%" height="100%" color="0x323232" backgroundColor="#ACACAC"> <mx:Label text="Add components here" fontWeight="bold" textAlign="center" width="100%"/> </mx:Canvas> <mx:Canvas label="Canvas 2" width="100%" height="100%" backgroundColor="#323232" > <mx:Label text="Add components here" fontWeight="bold" textAlign="center" width="100%"/> </mx:Canvas> </mx:HDividedBox> </mx:Panel> </mx:Application>
VDividedBox:
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="top" horizontalAlign="center" backgroundGradientColors="[0x000000,0x323232]" paddingTop="0" viewSourceURL="srcview/index.html"> <mx:Panel title="VDividedBox Container" layout="vertical" color="0xffffff" borderAlpha="0.15" width="500" height="240" paddingTop="10" paddingRight="10" paddingBottom="10" paddingLeft="10" horizontalAlign="center"> <mx:Text width="100%" color="0x323232" textAlign="center" text="Drag the divider up and down to resize the children."/> <mx:VDividedBox width="100%" height="100%"> <mx:Canvas label="Canvas 1" width="100%" height="100%" color="0x323232" backgroundColor="#ACACAC"> <mx:Label text="Add components here" fontWeight="bold" textAlign="center" width="100%"/> </mx:Canvas> <mx:Canvas label="Canvas 2" width="100%" height="100%" backgroundColor="#323232" > <mx:Label text="Add components here" fontWeight="bold" textAlign="center" width="100%"/> </mx:Canvas> </mx:VDividedBox> </mx:Panel> </mx:Application>
标签：DividedBox, FLEX, TourDeFlex, 例子
