鸿蒙移动应用开发项目式教程课件 项目1-创建人文历史专区-任务1-14 Scroll组件概述

Scroll组件

Scroll组件概述

Scroll组件作为可滚动的容器组件，当子组件的布局尺寸在指定的滚动方向上超过Scroll组件的视图窗口时，Scroll组件可以滚动。Scroll组件支持水平滚动和竖直滚动。Scroll组件滚动的前提是组件在主轴方向上的大小小于内容大小。Scroll组件回弹的前提是有滚动。内容小于一屏时，没有回弹效果。Scroller对象是可滚动容器组件的控制器，可以将其与容器组件绑定，然后通过它控制容器组件的滚动，同一个控制器不可以控制多个容器组件，目前支持将其绑定到List、Scroll、Grid、WaterFlow上。

导入Scroller对象的语法格式如下。知识解析学以致用课堂小结课后拓展1.1Scroll组件任务导入

Scroll组件的属性和事件

Scroll作为滚动容器，具备各种属性和事件，这里列举Scroll的常用属性scrollBar和edgeEffect。scrollBar属性允许开发者自定义滚动条的显示状态、颜色、宽度等属性，以满足不同的设计需求。通过合理设置scrollBar属性，可以使滚动条与应用的整体风格保持一致，同时提高UI的友好性和易用性。知识解析学以致用课堂小结课后拓展1.1Scroll组件任务导入

Scroll组件的属性和事件

1．自定义滚动条的显示状态

如果容器组件无法滚动，则滚动条不显示。如果容器组件的子组件大小为无穷大，则滚动条不支持拖动和伴随滚动。scrollBar属性的主要设置项显示状态如下。

BarState.On：滚动条常驻显示，即无论是否正在滚动，滚动条都会显示在界面上。

BarState.Auto：滚动条自动显示（默认状态），当内容超出可视区域且用户开始滚动时，滚动条出现；停止滚动后，滚动条可能会根据系统或应用的设置自动隐藏。

BarState.Off：滚动条不显示，无论内容是否超出可视区域或用户是否正在滚动。知识解析学以致用课堂小结课后拓展1.1Scroll组件任务导入

Scroll组件的属性和事件

2．自定义颜色

通过scrollBarColor属性可以设置滚动条的颜色，通常使用颜色代码（如Color.Gray）或颜色值（如#FFFFFF）来指定。

3．自定义宽度

通过scrollBarWidth属性可以设置滚动条的宽度，通常以长度单位（如vp、px等）来指定。

4．滚动到边缘时的效果edgeEffect属性用于设置滚动到边缘时的效果，如滚动到顶部或底部时显示边缘的弹性效果。这种效果可以优化UI的交互体验，让用户更清晰地感知滚动的边界。知识解析学以致用课堂小结课后拓展1.1Scroll组件任务导入

Scroll组件的属性和事件

在HarmonyOS中，edgeEffect属性通常接收枚举值，用于指定不同的边缘效果。虽然具体的枚举值可能因HarmonyOS版本不同而有所差异，但一般包括以下3种类型。

（1）EdgeEffect.Spring：弹性物理动效，滚动到边缘后，可以根据初始速度或通过触摸事件继续滚动一段距离，松手后回弹。

（2）EdgeEffect.Fade：阴影效果，滚动到边缘后会有弧状的阴影