HarmonyOS Swiper组建使用

在使用Swiper中有点疑问请教一下。

这里有个需求,Swiper组件中有多个页面,不止需要前后滑动翻页,还需要点击按钮可以滑动到指定的页面,比如点击某个按钮要直接从第1页滑动到第5页。发现swiperController只支持前后页滑动,而index属性可以跳到指定页面但是没有动画效果,请问这个该如何实现?

HarmonyOS
2024-09-03 09:25:44
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
zxjiu

可以通过如下方式实现:

Swiper组件的index属性支持状态绑定,即可实现跳转到指定index。

@State currentIndex:number = 1 
… 
Swiper(this.swiperController) { 
  … 
} 
.index(this.currentIndex) //使用状态变量 
… 
Row() { 
  Button(‘to index 3’) 
  .onClick(() => { 
    this.currentIndex = 3 //状态变量修改值 
  }) 
}

或者您可以使用List组件加载页面达到相同的效果,

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-list-0000001815086922-V5#ZH-CN_TOPIC_0000001815086922__%E4%BA%8B%E4%BB%B6

1.滑动到指定Index。

scrollToIndex(value: number, smooth?: boolean, align?: ScrollAlign): void

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-scroll-0000001815086930-V5#ZH-CN_TOPIC_0000001815086930__scrolltoindex

2.onScrollFrameBegin

列表开始滑动时触发,事件参数传入即将发生的滑动量,事件处理函数中可根据应用场景计算实际需要的滑动量并作为事件处理函数的返回值返回,列表将按照返回值的实际滑动量进行滑动。

offset:即将发生的滑动量,单位vp。

state:当前滑动状态。

offsetRemain:实际滑动量,单位vp。

触发该事件的条件:手指拖动List、List惯性划动时每帧开始时触发;List超出边缘回弹、使用滚动控制器和拖动滚动条的滚动不会触发。

分享
微博
QQ
微信
回复
2024-09-03 15:38:22
相关问题
HarmonyOS swiper + LazyForEach使用问题
148浏览 • 1回复 待解决
HarmonyOS swiper组件的使用问题
110浏览 • 1回复 待解决
HarmonyOS Swiper+ForEach使用问题
169浏览 • 1回复 待解决
使用swiper组件实现viewPager效果
1182浏览 • 1回复 待解决
HarmonyOS Swiper循环问题
232浏览 • 1回复 待解决
如何使用Swiper组件实现下拉刷新
650浏览 • 1回复 待解决
HarmonyOS 关于Swiper指示器问题
174浏览 • 1回复 待解决
HarmonyOS swiper如何滚动到任意页面?
223浏览 • 1回复 待解决
HarmonyOS Swiper里面的item高度自动刷新
297浏览 • 1回复 待解决
HarmonyOS Swiper支持动态修改数据吗
323浏览 • 1回复 待解决
Swiper是否支持组件复用
638浏览 • 1回复 待解决
litewearable支持swiper吗?
2461浏览 • 1回复 待解决
swiper切换监听生命周期
856浏览 • 1回复 待解决
Swiper切换不需要动画
245浏览 • 2回复 待解决