果冻滚动容器实例讲解

作者：创世魂

本组件和普通的“横向滚动容器”，用法基本是一致的。

不同之处在于，当容器内的组件无法滚动时，再次滚动的时候会产生一种弹性的动画效果。

注意：本组件位于“果冻滚动容器”模块中，欲使用本组件需添加其模块。

界面设计如下图：

1、拖放一个“按钮1”组件，在此组件下放置一个“果冻滚动容器”组件，设置组件尺寸为匹配父组件尺寸。

2、在“果冻滚动容器”组件内拖放一个“线性布局器”组件，设置组件尺寸为匹配父。

3、在“线性布局器”组件内拖放N个按钮，使其内容有滚动效果。

运行效果如下图：

最终可以看到“果冻滚动容器”内的组件不仅具有滚动效果，同时也具有一种弹性动画效果。

“支持滚动监听（写）”帮助文档：

调用本属性设置为真，可实现监听“滚动位置改变”事件。

“滚动位置改变（事件）”帮助文档：

设置“滚动位置改变”属性为真的时候，本事件会被触发。

代码编写如下图：

1、“按钮1”被点击后，设置“支持滚动监听”属性值为真。

2、添加“滚动位置改变”事件，读取“当前垂直位置”显示在标题上。

运行结果如下图（GIF）：

“按钮1”被点击之前，无论如何滚动容器，都无法实现标题显示位置信息。

“按钮2”被点击后，滚动容器时窗口标题会显示“当前垂直位置”。

帮助文档如下图：

本方法可实现增量滚动指定像素距离。

代码编写如下图：

调用本方法增量滚动100像素的距离。

运行结果如下图（GIF）：

最终可以看到当前滚动容器增量滚动了100像素的距离。

帮助文档如下图：

调用本方法可滚动内容到指定像素距离。

代码编写如下图：

“按钮1”被点击后调用本方法滚动到100像素位置。

运行结果如下图（GIF）：

最终可看到，无论滚动容器在什么位置，点击“按钮1”后都会回到100像素位置。

帮助文档如下图：

调用本方法可进行收尾滚动。

参数提供-1向上滚动头部，提供1向下滚动到尾部。

代码编写如下图：

调用本方法滚动到尾部。

运行结果如下图（GIF）：

“按钮1”被点击后执行本方法可滚动到尾部。