flex中HBox(VBox)组件嵌套容器中的布局设置比例探究实例
<?xml version="1.0" encoding="utf-8"?><s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768" creationComplete="initApp();"><fx:Script><![CDATA[private function initApp():void{ trace(hbox01ID.width, "===", hbox01ID.x);trace(hbox02ID.width, "***", hbox02ID.x);}]]></fx:Script><!--HBox(VBox)组件嵌套容器中的布局设置比例探究(在此以HBox组件为例) HBox里的子组件按照从左往右排列; 设置父容器间距:horizontalGap="0" verticalGap="0"(默认的两个都不为零),此设置为的是可以自定义的更加精确; 几个孩子组件的宽度和仍小于HBox的长度,则右边的空间就剩着; 计算每个百分比表示的子组件的长度: (父容器剩余的总共的实际的长度:总余长sleng) sonLeng = sleng * (子组件长(百分比表示) / 所有已百分比表示的组件的长度总和(百分比表示)); 例如:子组件hboxID的实际长度像素为:(500 - 0) * (50% / (50% + 100%)); --><mx:HBox id="hboxID" x="200" y="100" width="500" height="300" backgroundColor="red" horizontalGap="0" verticalGap="0"><mx:HBox id="hbox01ID" width="55%" height="50%" backgroundColor="blue"/><mx:HBox id="hbox02ID" width="50%" height="100%" backgroundColor="yellow"/></mx:HBox></s:Application>