Flex 学习之路之九用户接口user interface includeInLayout 和visible区别

最新推荐文章于 2019-11-16 22:40:29 发布

原创最新推荐文章于 2019-11-16 22:40:29 发布 · 560 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#用户接口user interface i

flex 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了一个使用Adobe Flex的Spark组件集实现的简单应用案例。通过两个按钮切换面板的可见性和布局包含状态，演示了如何利用visible属性和includeInLayout属性控制UI元素的显示与隐藏效果。

<?xml version="1.0"?>
<!-- components\HiddenBoxLayout.mxml -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   height="500">
	<s:layout>
		<s:VerticalLayout/>
	</s:layout>
	<s:SkinnableContainer>
		<s:layout>
			<s:VerticalLayout/>
		</s:layout>
		<s:Panel id="p1"
				 title="Panel 1"/>
		<s:Panel id="p2"
				 title="Panel 2"/>
		<s:Panel id="p3"
				 title="Panel 3"/>
	</s:SkinnableContainer>
	<s:SkinnableContainer>
		<s:layout>
			<s:HorizontalLayout/>
		</s:layout>
		<s:Button label="Toggle Panel 2 Visible"
				  click="{p2.visible=!p2.visible;}"/>
		<s:Button label="Toggle Panel 2 in Layout"
				  click="{p2.includeInLayout=!p2.includeInLayout;}"/>
	</s:SkinnableContainer>
</s:Application>

visible 表示控件消失了，位置还在，includeInLayout表示控件的位置消失了，这个位置会被其他控件所占用