当前位置: 首页 > news >正文

鸿蒙-设置Rerefsh的下拉距离

主要如下两行代码:
.pullDownRatio(this.ratio) //设置跟手系数,为0时就拉不动了
.onOffsetChange((offset: number)=>{ 
this.ratio = 1 - Math.pow((offset / this.maxRefreshingHeight), 3) // 越接近最大距离,下拉跟手系数越小 
})demo如下:
import { ComponentContent } from '@ohos.arkui.node';@Builder
function customRefreshingContent() {Stack() {Row() {LoadingProgress().height(32)}.alignItems(VerticalAlign.Center)}.align(Alignment.Center).clip(true).constraintSize({minHeight:32}) // 设置最小高度约束保证自定义组件高度随刷新区域高度变化时自定义组件高度不会低于minHeight.width("100%")
}@Entry
@Component
struct RefreshExample {@State isRefreshing: boolean = false@State arr: String[] = ['0', '1', '2', '3', '4','5','6','7','8','9','10']@State maxRefreshingHeight: number = 100.0@State ratio: number = 1private contentNode?: ComponentContent<Object> = undefinedaboutToAppear():void {let uiContext = this.getUIContext();this.contentNode = new ComponentContent(uiContext, wrapBuilder(customRefreshingContent))}build() {Column() {Refresh({ refreshing: $$this.isRefreshing, refreshingContent:this.contentNode}) {List() {ForEach(this.arr, (item: string) => {ListItem() {Text('' + item).width('70%').height(80).fontSize(16).margin(10).textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF)}}, (item: string) => item)}.onScrollIndex((first: number) => {console.info(first.toString())}).width('100%').height('100%').alignListItem(ListItemAlign.Center).scrollBar(BarState.Off)}.backgroundColor(0x89CFF0).pullDownRatio(this.ratio).pullToRefresh(true).refreshOffset(64).onOffsetChange((offset: number)=>{this.ratio = 1 - Math.pow((offset / this.maxRefreshingHeight), 3) // 越接近最大距离,下拉跟手系数越小}).onStateChange((refreshStatus: RefreshStatus) => {console.info('Refresh onStatueChange state is ' + refreshStatus)}).onRefreshing(() => {setTimeout(() => {this.isRefreshing = false}, 2000)console.log('onRefreshing test')})}}
}

http://www.mrgr.cn/news/18792.html

相关文章:

  • python-第三方库-[yarl、yaml]
  • 太狠了:华为的卫星通信能免费使用了
  • 环保专包二级资质续期时要避免的常见错误
  • ESP32无线WiFi芯片模组,设备物联网连接通信,产品智能化交互升级
  • 场外个股期权为什么那么火?收益翻倍不是梦!
  • 电商数据整合新篇章:京东商品详情API返回值应用实践
  • 全能型AI vs.专业型AI:未来趋势与市场潜力探讨
  • Kafka【六】Linux下安装Kafka集群
  • springboot、flowable 生成图片发布到Docker乱码问题
  • AOP和注解的配合使用(封装通用日志处理类)
  • 团建活动如何分组?
  • LearnOpenGL学习笔记
  • 探索电子翻书在展厅的应用,如何进一步优化信息展示与接收?
  • 高校为什么需要AIGC大数据实验室?
  • 青远生态为云南林业规划院定制开发的自然保护地规划智能编制系统顺利通过验收
  • ubunto中常见问题及WSL
  • 盘古信息IMS V6:先进稳定的企业数字化转型方案
  • 王立铭脑科学50讲后续5,自己从课程中提起自己所需的知识,安放到自己的知识体系中。
  • 使用dx工具将jar和class打包成dex
  • Web3社交新经济,与 SOEX 实现无缝交易的高级安全性