• 滚动布局管理器 ScrollArrangementHandler
  • 水平滚动布局管理器 HorizontalScrollHandler
    • 事件 Events
    • 方法 Methods
    • 属性 Properties
  • 垂直滚动布局管理器 VerticalScrollHandler
    • 事件 Events
    • 方法 Methods
    • 属性 Properties
  • 使用示例
    • 基本用法
    • 高级应用
    • 应用场景展示
  • 下载地址

滚动布局管理器 ScrollArrangementHandler

这个拓展包内包含了两个拓展，水平滚动布局管理器HorizontalScrollHandler，和垂直滚动管理器VerticalScrollHandler。

水平滚动布局管理器 HorizontalScrollHandler

水平滚动布局管理器允许在同一屏幕内实现左右页面切换效果，无需切换到不同的屏幕。

事件 Events

向左过度拖动(位移 数值)

当用户向左过度拖动布局时触发此事件

向右过度拖动(位移 数值)

当用户向右过度拖动布局时触发此事件

布局滚动到最左端()

当布局滚动到最左端位置时触发此事件

布局滚动到最右端()

当布局滚动到最右端位置时触发此事件

布局发生滚动(滚动位置X 数值)

当布局位置发生改变时触发此事件，参数为当前水平滚动位置

布局被按下()

当用户按下布局时触发此事件

布局被松开()

当用户松开布局时触发此事件

方法 Methods

向左半页滚动()

使布局向左滚动半个页面的距离

向右半页滚动()

使布局向右滚动半个页面的距离

向左整页滚动()

使布局向左滚动一个完整的页面距离

向右整页滚动()

使布局向右滚动一个完整的页面距离

绑定水平滚动布局(水平滚动布局 水平滚动布局组件)

将此滚动处理器绑定到指定的水平滚动布局组件

滚动一段距离(像素 数值)

使布局滚动指定的像素距离。向右为正，向左为负

滚动到最左()

将布局滚动到最左端位置

滚动到最右()

将布局滚动到最右端位置

滚动到指定位置(像素 数值)

将布局滚动到指定的水平位置

平滑的滚动一段距离(像素 数值)

使布局平滑地滚动指定的像素距离

平滑的滚动到指定位置(像素 数值)

将布局平滑地滚动到指定的水平位置

属性 Properties

显示渐变边缘 布尔值

设置是否在布局边缘显示渐变效果，当内容超出可视区域时

最大滚动位置 数值 只读

返回布局可以滚动的最大水平位置

过度滚动动画样式 数值

设置过度滚动的动画样式：

• 0 - 总是允许过度滚动
• 1（默认） - 当布局可以被有效滚动时才允许过度滚动
• 2 - 禁止过度滚动

（在不同版本的系统中过度滚动动画看起来可能会不太一样）

显示滚动条 布尔值

设置是否显示水平滚动条

滚动位置 数值 只读

返回当前的水平滚动位置

允许用户操作滚动布局 布尔值

设置是否允许用户通过触摸操作来滚动布局

垂直滚动布局管理器 VerticalScrollHandler

垂直滚动布局管理器允许在同一屏幕内实现上下页面切换效果，适合长内容展示和列表浏览。

事件 Events

向下过度拖动(位移 数值)

当用户向下过度拖动布局时触发此事件

向上过度拖动(位移 数值)

当用户向上过度拖动布局时触发此事件

布局滚动到底端()

当布局滚动到最底端位置时触发此事件

布局滚动到顶端()

当布局滚动到最顶端位置时触发此事件

布局发生滚动(滚动位置Y 数值)

当布局位置发生改变时触发此事件，参数为当前垂直滚动位置

布局被按下()

当用户按下布局时触发此事件

布局被松开()

当用户松开布局时触发此事件

方法 Methods

向上半页滚动()

使布局向上滚动半个页面的距离

向下半页滚动()

使布局向下滚动半个页面的距离

向上整页滚动()

使布局向上滚动一个完整的页面距离

向下整页滚动()

使布局向下滚动一个完整的页面距离

绑定垂直滚动布局(垂直滚动布局 垂直滚动布局组件)

将此滚动处理器绑定到指定的垂直滚动布局组件

滚动到底端()

将布局滚动到最底端位置

滚动一段距离(像素 数值)

使布局滚动指定的像素距离。向下为正，向上为负

滚动到指定位置(像素 数值)

将布局滚动到指定的垂直位置

滚动到顶端()

将布局滚动到最顶端位置

平滑的滚动一段距离(像素 数值)

使布局平滑地滚动指定的像素距离

平滑的滚动到指定位置(像素 数值)

将布局平滑地滚动到指定的垂直位置

属性 Properties

显示渐变边缘 布尔值

设置是否在布局边缘显示渐变效果，当内容超出可视区域时

最大滚动位置 数值 只读

返回布局可以滚动的最大垂直位置

过度滚动动画样式 数值

设置过度滚动的动画样式：

• 0 - 总是允许过度滚动
• 1（默认） - 当布局可以被有效滚动时才允许过度滚动
• 2 - 禁止过度滚动

（在不同版本的系统中过度滚动动画看起来可能会不太一样）

显示滚动条 布尔值

设置是否显示垂直滚动条

当前滚动位置 数值 只读

返回当前的垂直滚动位置

允许用户操作滚动布局 布尔值

设置是否允许用户通过触摸操作来滚动布局

使用示例

基本用法

1. 拖拽组件到设计器
   • 从组件面板中拖拽HorizontalScrollHandler或VerticalScrollHandler到屏幕上
   • 拖拽相应的ScrollArrangement组件到屏幕上
2. 绑定滚动布局

   when Screen1.Initialize
   do
       // 绑定水平滚动布局
       call HorizontalScrollHandler1.RegisterScrollView HorizontalArrangement1
   
       // 绑定垂直滚动布局
       call VerticalScrollHandler1.RegisterScrollView VerticalArrangement1
   

3. 响应滚动事件

   // 水平滚动事件处理
   when HorizontalScrollHandler1.ScrollChanged scrollX
   do
       set Label_Position.Text to "当前位置: " & scrollX
   
   // 到达右端事件
   when HorizontalScrollHandler1.ReachRightEnd
   do
       show notification "已到达最右端"
   
   // 垂直滚动事件处理
   when VerticalScrollHandler1.ScrollChanged scrollY
   do
       set Label_VerticalPosition.Text to "垂直位置: " & scrollY
   

4. 程序控制滚动

   // 向右滚动一页
   when Button_NextPage.Click
   do
       call HorizontalScrollHandler1.PageScrollRightward
   
   // 平滑滚动到指定位置
   when Button_GoToPosition.Click
   do
       call HorizontalScrollHandler1.SmoothScrollTo 500
   

高级应用

通过结合多个滚动处理器，可以创建复杂的页面切换效果：

• 水平翻页效果：使用HorizontalScrollHandler实现类似ViewPager的翻页效果
• 垂直列表浏览：使用VerticalScrollHandler创建可滚动的长列表内容
• 双向滚动：同时使用水平和垂直滚动处理器实现2D滚动效果

应用场景展示

ScrollArrangementHandler拓展特别适用于以下场景：

• 电子书阅读器：实现页面翻页效果
• 图片浏览器：左右滑动浏览图片
• 产品展示：多页面产品介绍
• 引导页面：应用首次使用的引导流程
• 菜单导航：横向菜单项切换
• 长内容浏览：文章、新闻等长文本阅读

下载地址

• 最后更新：2017.12.25
• 拓展文件：ScrollArrangementHandlers.aix

本文档基于ColinTree官方文档整理翻译，原文 侵删。点此参考讨论。