openharmony容器组件之Refresh

Refresh：下拉刷新容器
Refresh(value: {refreshing: boolean, offset?: Length, friction?: number})
refreshing：当前组件是否正在刷新
offset：刷新组件静止时距离父组件顶部的距离（默认16）
friction：下拉摩擦系数，取值范围为0到100（默认62）
       0表示下拉刷新容器不跟随手势下拉而下拉
       100表示下拉刷新容器紧紧跟随手势下拉而下拉
       数值越大，下拉刷新容器跟随手势下拉的反应越灵敏
事件：
onStateChange(callback: (state: RefreshStatus) => void)   当前刷新状态变更时，触发回调。
   state：刷新状态
       Inactive：默认未下拉状态
       Drag：下拉中，下拉距离小于刷新距离
       OverDrag：下拉中，下拉距离超过刷新距离
       Refresh：下拉结束，回弹至刷新距离，进入刷新状态
       Done：刷新结束，返回初始状态（顶部）
onRefreshing(callback: () => void)   进入刷新状态时触发回调

效果如图：

代码：

@Entry
@Component
struct RefreshPage {@State isRefreshing: boolean = false@State counter: number = 0build() {Column() {Refresh({ refreshing: this.isRefreshing, offset: 120, friction: 100 }) {Text('pull down and refresh:' + this.counter).fontSize(30).margin(10)}.onStateChange((refreshStatus: RefreshStatus) => {console.info('Refresh onStatueChange state is ' + refreshStatus.toString())}).onRefreshing(() => {setTimeout(() => {this.counter++this.isRefreshing = false}, 1000)console.log('onRefreshing test')})}.width('100%').height('100%')}
}

openharmony容器组件之Refresh相关推荐

openharmony容器组件之GridItem
GridItem:网格容器中单项内容容器 GridItem()属性: rowStart:用于指定当前元素起始行号. rowEnd:用于指定当前元素终点行号. columnStart:用于指定当前元素起 ...
openharmony容器组件之Grid
Grid:网格容器,由"行"和"列"分割的单元格所组成,通过指定"项目"所在的单元格做出各种各样的布局 Grid()属性: columnsT ...
openharmony容器组件之Badge
Badge:新事件标记组件,在组件上提供事件信息展示能力 Badge(value: {count: number, position?: BadgePosition, maxCount?: numbe ...
openharmony容器组件之GridContainer
GridContainer:纵向排布栅格布局容器,仅在栅格布局场景中使用 GridContainer(options?: { columns?: number | 'auto', sizeType?: ...
java中组件与容器_java中的容器组件和非容器组件
1.java使用到的图形类主要在java.awt 与javax.swing包中. 2.java.awt 与 javax.swing包的区别: ① java.awt中使用的图形类都是依赖于系统的图形库的 ...
八十、React中的容器组件和无状态组件
2020/11/20. 周五.今天又是奋斗的一天. @Author:Runsen React,也有了自己去构建一些应用的信心,那会是一种非常棒的感觉. 容器组件和无状态组件 React类组件是在Jav ...
SAP 产品 UI 里的容器组件的概念和开发概述
这是 Jerry 2021 年的第 68 篇文章,也是汪子熙公众号总共第 345 篇原创文章. Jerry 之前的文章,谈谈 SAP 产品 UI 开发中的组件概念,曾经提到,无论基于何等开发技术的 S ...
[react] 展示组件和容器组件有什么区别？
[react] 展示组件和容器组件有什么区别? 展示组件(Presentational Component) 关注页面的展示效果(外观) 内部可以包含展示组件和容器组件,通常会包含一些自己的DOM标记 ...
使用container的嵌套_ElementUI 技术揭秘（4）— Container 布局容器组件的设计与实现。...
前言上一篇文章我们分析了 Layout 布局组件的设计和实现,它的应用场景通常是局部布局.对于整个页面的布局,element-ui 提供了 Container 布局容器组件,专门用于 PC 管理后台 ...

openharmony容器组件之Refresh

openharmony容器组件之Refresh相关推荐

最新文章

热门文章