3.26.控制子组件的可见性和布局
3.26.1 问题
你需要无破坏地从容器的已有布局中移动子组件。
3.26.2 解决办法
使用UIComponent 类的includeInLayout 属性同时把visibility 设置为空。
3.26.3 讨论
某容器的子组件的includeInLayout 属性表明该子组件是否包含在父亲布局子组件使用的任意布局计划中：VBox, HBox, 或一个Canvas 的居中设置。如果仅仅简单地将子组件的visibility 设置为false，它将仍然包含在父亲的布局机构当中，拥有足够容纳其宽和高所需要的空间。改为将includeInLayout 设置成false 以保证Hbox 不会给该子组件布局空间：
重新包含此子组件到布局中，设置includeInLayout 为true。下面的例子通过includeInLayout 属性使得子组件可被拖拽。随着包含到Hbox 的布局中，布局管理器会改变子组件的位置以遵守其布局。由于includeInLayout 属性设置成false，当Hbox 设置它所有子组件的x 值的时候会忽略这个子组件。
你需要无破坏地从容器的已有布局中移动子组件。
3.26.2 解决办法
使用UIComponent 类的includeInLayout 属性同时把visibility 设置为空。
3.26.3 讨论
某容器的子组件的includeInLayout 属性表明该子组件是否包含在父亲布局子组件使用的任意布局计划中：VBox, HBox, 或一个Canvas 的居中设置。如果仅仅简单地将子组件的visibility 设置为false，它将仍然包含在父亲的布局机构当中，拥有足够容纳其宽和高所需要的空间。改为将includeInLayout 设置成false 以保证Hbox 不会给该子组件布局空间：
+展开
;-ActionScript
(event.target as UIComponent).includeInLayout = false
重新包含此子组件到布局中，设置includeInLayout 为true。下面的例子通过includeInLayout 属性使得子组件可被拖拽。随着包含到Hbox 的布局中，布局管理器会改变子组件的位置以遵守其布局。由于includeInLayout 属性设置成false，当Hbox 设置它所有子组件的x 值的时候会忽略这个子组件。
+展开
-XML
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="600"height="400">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
private function
removeFromLayout(event:MouseEvent):void
{
(event.target as UIComponent).includeInLayout =
false;
(event.target as UIComponent).startDrag();
}
private function
reincludeInLayout(event:MouseEvent):void
{
(event.target as UIComponent).stopDrag();
(event.target as UIComponent).includeInLayout = true;
}
private function
hideAndRemoveFromLayout(event:Event):void
{
(event.target as UIComponent).visible = false;
(event.target as UIComponent).includeInLayout =
false;
}
]]>
</mx:Script>
<mx:VBox>
<mx:LinkButton id="firstLabel" label="this is the first
label" mouseDown="removeFromLayout(event)"
mouseUp="reincludeInLayout(event)"/>
<mx:LinkButton id="secondLabel" label="this is the second
label" mouseDown="removeFromLayout(event)"
mouseUp="reincludeInLayout(event)"/>
<mx:Button id="button" label="My First Button"
mouseDown="removeFromLayout(event)"
mouseUp="reincludeInLayout(event)"/>
</mx:VBox>
<mx:VBox>
<mx:Button label="Remove from Layout and Hide"
click="hideAndRemoveFromLayout(event)" borderColor="#0000ff"/>
<mx:Button label="Remove from Layout and Hide"
click="hideAndRemoveFromLayout(event)"
borderColor="#00ff00"/>
<mx:Button label="Remove from Layout and Hide"
click="hideAndRemoveFromLayout(event)"
borderColor="#ff0000"/>
</mx:VBox>
</mx:HBox>
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
private function
removeFromLayout(event:MouseEvent):void
{
(event.target as UIComponent).includeInLayout =
false;
(event.target as UIComponent).startDrag();
}
private function
reincludeInLayout(event:MouseEvent):void
{
(event.target as UIComponent).stopDrag();
(event.target as UIComponent).includeInLayout = true;
}
private function
hideAndRemoveFromLayout(event:Event):void
{
(event.target as UIComponent).visible = false;
(event.target as UIComponent).includeInLayout =
false;
}
]]>
</mx:Script>
<mx:VBox>
<mx:LinkButton id="firstLabel" label="this is the first
label" mouseDown="removeFromLayout(event)"
mouseUp="reincludeInLayout(event)"/>
<mx:LinkButton id="secondLabel" label="this is the second
label" mouseDown="removeFromLayout(event)"
mouseUp="reincludeInLayout(event)"/>
<mx:Button id="button" label="My First Button"
mouseDown="removeFromLayout(event)"
mouseUp="reincludeInLayout(event)"/>
</mx:VBox>
<mx:VBox>
<mx:Button label="Remove from Layout and Hide"
click="hideAndRemoveFromLayout(event)" borderColor="#0000ff"/>
<mx:Button label="Remove from Layout and Hide"
click="hideAndRemoveFromLayout(event)"
borderColor="#00ff00"/>
<mx:Button label="Remove from Layout and Hide"
click="hideAndRemoveFromLayout(event)"
borderColor="#ff0000"/>
</mx:VBox>
</mx:HBox>
加支付宝好友偷能量挖...
