flex4(Spark容器) 中的滚动条问题

Spark容器的滚动条不像Halo一样会自动加载,它已被独立出来,需要我们自行设计。

一、使用滚动组件Scroller包含需要滚动的容器

二、对于List等基于列表的组件,Scroller已加到其skinclass中,需要的话,可以重写它们的skinclass来控制Scroller

1、例如,Spark 容器 Group 和 DataGroup 都是轻量级的基本的构造块类。即便如此它们支持滚动,它们不会像 Halo 那样自动装配滚动条。Spark 提供底层 APIs 帮助手动为 Group 和 DataGroup 挂接滚动条-clipAndEnableScrolling, horizontalScrollPosition, verticalScrollPosition, contentWidth,contentHeight。但同样有一个组件简化了这一过程。将 Group 或 DataGroup 嵌入到 Scroller 中就可以了,Scroller 会处理挂接以及在必要时显示滚动条。

<s:Scroller width="200">
<s:Group>
<s:layout>
<s:HorizontalLayout gap="0" verticalAlign="justify"/>
</s:layout>
<s:Button label="one"/>
<s:Button label="two"/>
<s:Button label="three"/>
<s:Button label="four"/>
<s:Button label="five"/>
</s:Group>
</s:Scroller>
2、事实上,这正是其他Spark容器(如 List )实现滚动的具体过程。它们的皮肤中包含一个 contentGroup 或 dataGroup ,并且被放置在Scroller中了。查看默认的List皮肤 (spark/skins/spark/ListSkin.mxml) 就会发现这一点。

...
<!--- The Scroller component to add scroll bars to the list. -->
<s:Scroller left="0" top="0" right="0" bottom="0" id="scroller"
minViewportInset="1" focusEnabled="false">
<!--- The container for the data items. -->
<s:DataGroup id="dataGroup" itemRenderer="spark.skins.spark.DefaultItemRenderer">
<s:layout>
<s:VerticalLayout gap="0" horizontalAlign="contentJustify" />
</s:layout>
</s:DataGroup>
</s:Scroller>
...
附:

Spark 容器
所有 Spark 容器都支持可指定布局。

Group-Flex 4 中的一个不可设计外观的容器类,它可以包含 UIComponents 等可视子代、Adobe Flash Professional 中创建的 Flex 组件或图形元素。
DataGroup-Flex 4 中的一个不可设计外观的容器类,它只能包含子代等非可视数据项。DataGroup 容器支持生成项呈示器(这是一种可视元素,它将数据项转换为可显示项)及其元素的虚拟化。
SkinnableContainer-Group 的可设计外观的版本。
SkinnableDataContainer-DataGroup 的可设计外观的版本。
Application-针对基于浏览器的 Flex 应用程序、可设计外观的顶级容器(与 AIR 应用程序相反,后者使用下述 Spark WindowedApplication 容器)。
BorderContainer-支持边框和背景填充的 CSS 样式的一个可设计外观的容器(与 MX 容器支持的边框和背景样式类似)。
Panel-支持标题栏、题注和边框的一个可设计外观的容器。
TitleWindow-与 Panel 类似、支持关闭按钮和可移动区域的一个可设计外观的容器。TitleWindow 将通过 PopUpManager 以弹出窗口形式弹出。
Window-可用作 Adobe AIR 应用程序中的顶级应用程序窗口的一个可设计外观的组件。
WindowedApplication-定义 Adobe AIR 应用程序中的应用程序容器的一个可设计外观的组件。
基于列表的组件
List-显示数据项、可设计外观的组件。它支持生成项呈示器、单项和多项选择、拖放操作、虚拟化和可指定布局。
DropDownList-允许用户从拖放打开的列表中选择值、可设计外观的组件。
ComboBox-可设计外观的组件,实质上是一个带有可编辑功能的 Spark DropDownList。


引用:http://flex4jiaocheng.com/blog/266
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值