3
容器
.
容器
(containers)
这个词通常指的是在
Flex
框架的
mx.containers
包里面的所有类。容器扩展自
UIComponent
类,添加了布局管理功能,用创建法则(
creation policies)
控制子对象的创建的一系列方法,并自动卷动。各个容器的行为有很大的不同,不过都有定位子对象,用约束或样式布局子对象的能力,并控制卷动,觉得子对象对卷动事件的响应。
对
Flex 3
而言,约束是个新东西。它们让开发者从位置和尺寸两个方面创建定位的规则,并指派给容器的子对象。只有容器才有约束,比如
Canvas
容器,
Canvas
也可以绝对定位,这跟
CSS
的作用几乎一样。
Box
和
Tile
容器提供了子对象的自动布局,还有控制包含在布局管理器里的子对象的方法。
3.1
用布局管理器定位子对象
3.1.1
问题
你需要水平或垂直定位多个子对象,并控制这些子对象的布局。
3.1.2
解答
用
HBox
或
VBox
容器,为
HBox
或
VBox
设置水平间距(
horizontalGap
)或垂直间距(
verticalGap
),相应地,设置组件之间的距离。
3.1.3
讨论
扩展自相同的基类
mx.containers.Box, HBox
和
VBox
组件水平地或垂直地布局它们的子对象,他们各自可以包含无数个子对象。
当子对象的尺寸大于
Box
组件的高或宽时,该
Box
组件会默认添加相应的滚动条。要确定子对象之间的距离,
VBox
容器用
verticalGap
属性,
HBox
容器用
horizontalGap
属性。比如:
<mx:VBox width="400" height="300" verticalGap="20">
<mx:Button label="Button"/>
<mx:LinkButton label="Link Button"/>
</mx:VBox>
可是
HBox
和
VBox
容器不考虑上,下,左,右的约束属性。要在子对象和它们的
Box
容器之间添加空隙,用如下的
Spacer
控件:
<mx:VBox width="400" height="300" verticalGap="20">
<mx:Button label="Button"/>
<mx:ComboBox top="60"/>
<mx:Spacer height="20"/>
<mx:LinkButton label="Link Button"/>
</mx:VBox>
要改变子对象的边缘之间的距离或距离填充样式,添加
paddingTop, paddingLeft, paddingRight,
或
paddingBottom
样式。这会影响到所以添加到容器内的子对象。如果要左右移动
VBox
里或上下移动
HBox
里的单个子对象,就在
Box
里添加一个容器,用他来定位子对象:
<mx:HBox x="400" horizontalGap="10" top="15">
<mx:Canvas>
<mx:Button top="50" label="Button" y="20"/>
</mx:Canvas>
<mx:Panel height="40" width="40"/>
<mx:Spacer width="25"/>
<mx:LinkButton label="Label"/>
<mx:ComboBox/>
</mx:HBox>
下面这个例子在一个
Canvas
容器内用到了
HBox
和
VBox
来显示以上两种布局方式:
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" >
<mx:VBox width="400" height="300" verticalGap="20">
<mx:Button label="Button"/>
<mx:ComboBox/>
<mx:Spacer height="20"/>
<mx:LinkButton label="Link Button"/>
</mx:VBox>
<mx:HBox x="400" horizontalGap="10" top="15">
<mx:Canvas>
<mx:Button top="50" label="Button" y="20"/>
</mx:Canvas>
<mx:Panel height="40" width="40"/>
<mx:Spacer width="25"/>
<mx:LinkButton label="Label"/>
<mx:ComboBox/>
</mx:HBox>
</mx:Canvas>
- 大小: 3 KB
- 大小: 3.1 KB
- 大小: 1.6 KB
分享到:
相关推荐
Flex 3 Cookbook.Flex 3 Cookbook.Flex 3 Cookbook.Flex 3 Cookbook.Flex 3 Cookbook.Flex 3 Cookbook.Flex 3 Cookbook.
Flex 3 Cookbook简体中文版最新推荐常青Flex 3 Cookbook简体中文版最新推荐常青Flex 3 Cookbook简体中文版最新推荐常青Flex 3 Cookbook简体中文版最新推荐常青
Flex3 CookBook 教程 Flex3 CookBook 教程
Flex 3 Cookbook[中文版].pdf 网络上大力推荐的Flex学习图书
如果您是用Flex, 很好用的一本書。 Flex 3 Cookbook by Joshua Noble; Todd AndersonPublisher: O'ReillyPub Date: May 6, 2008 Print ISBN-13: 978-0-596-52985-7 Pages: 704 The best way to show off a powerful...
Flex3CookBook中文版Flex3CookBook中文版Flex3CookBook中文版Flex3CookBook中文版
Flex 4 Cookbook
Flex 3 Cookbook 中文版 Flex 3 Cookbook 中文版 Flex 3 Cookbook 中文版 Flex 3 Cookbook 中文版 Flex 3 Cookbook 中文版
Flex 3 CookBook源码 Flex 3 CookBook源码
Flex 3 Cookbook.pdfFlex 3 Cookbook.pdfFlex 3 Cookbook.pdfFlex 3 Cookbook.pdf
flex3 cookbook bonus chapter 代码
flex3cookbook.rar Flex的资源很少 珍惜
flex3 cookbook 范例数据,homesforsale.xml
flex3 cookbook 英文版pdf
flex4 cookbook下载flex4 cookbook下载flex4 cookbook下载flex4 cookbook下载flex4 cookbook下载flex4 cookbook下载
Flex 4 Cookbook 英文版( pdf 非影印版)
flex3 Cookbook中文版,适合flex学习入门,讲解比较详细,有较多的例子代码
Flex 3 Cookbook(英文版)