列表滑动惯性处理问题

目前用List实现横向翻页效果, 我发现我不做额外设置的时候, 一次滑动之后, 因为滑动过快会划过好多页, 但是List提供了friction参数进行控制, 但是设置之后效果很不理想, 有时候滑动不会触发翻页, 而且friction参数不是一个运动相关的属性值, 无法直接设置一个明确的值来满足所有的滑动场景. Scroller也有类似参数speedLimit控制, 但是效果也不理想。

HarmonyOS
2024-10-11 11:31:51
973浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
zxjiu

参考以下代码:

class MyDataSource implements IDataSource {  
  private list: number[] = []  
  
  constructor(list: number[]) {  
    this.list = list  
  }  
  
  totalCount(): number {  
    return this.list.length  
  }  
  
  getData(index: number): number {  
    return this.list[index]  
  }  
  
  registerDataChangeListener(listener: DataChangeListener): void {  
  }  
  
  unregisterDataChangeListener() {  
  }  
}  
  
@Entry  
@Component  
struct SwiperExample {  
  private swiperController: SwiperController = new SwiperController()  
  private data: MyDataSource = new MyDataSource([])  
  @State myIndex: number = 1;  
  
  aboutToAppear(): void {  
    let list: number[] = []  
    for (let i = 1; i <= 10; i++) {  
      list.push(i);  
    }  
    this.data = new MyDataSource(list)  
  }  
  
  build() {  
    Column({ space: 5 }) {  
      Row({ space: 12 }) {  
        LazyForEach(this.data, (item: string, index: number) => {  
          Button((index + 1).toString())  
            .onClick(() => {  
              this.myIndex = index  
            })  
        })  
      }  
  
      Swiper(this.swiperController) {  
        LazyForEach(this.data, (item: string) => {  
          Text(item.toString())  
            .width('90%')  
            .height(160)  
            .backgroundColor(0xAFEEEE)  
            .textAlign(TextAlign.Center)  
            .fontSize(30)  
        }, (item: string) => item)  
      }  
      .cachedCount(2)  
      .index(this.myIndex)  
      .autoPlay(false)  
      .loop(true)  
      .duration(300)  
      .itemSpace(0)  
      .indicator(false)  
      .curve(Curve.Linear)  
      .onChange((index: number) => {  
        console.info("onChange:" + index.toString())  
        this.myIndex = index  
      })  
      .onGestureSwipe((index: number, extraInfo: SwiperAnimationEvent) => {  
        console.info("index: " + index)  
        console.info("current offset: " + extraInfo.currentOffset)  
      })  
      .onAnimationStart((index: number, targetIndex: number, extraInfo: SwiperAnimationEvent) => {  
        console.info("index: " + index)  
        console.info("targetIndex: " + targetIndex)  
        console.info("current offset: " + extraInfo.currentOffset)  
        console.info("target offset: " + extraInfo.targetOffset)  
        console.info("velocity: " + extraInfo.velocity)  
      })  
      .onAnimationEnd((index: number, extraInfo: SwiperAnimationEvent) => {  
        console.info("index: " + index)  
        console.info("current offset: " + extraInfo.currentOffset)  
      })  
    }.width('100%')  
    .margin({ top: 5 })  
  }  
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65.
  • 66.
  • 67.
  • 68.
  • 69.
  • 70.
  • 71.
  • 72.
  • 73.
  • 74.
  • 75.
  • 76.
  • 77.
  • 78.
  • 79.
  • 80.
  • 81.
  • 82.
  • 83.
  • 84.
  • 85.
  • 86.
  • 87.
  • 88.
  • 89.
分享
微博
QQ
微信
回复
2024-10-11 16:22:14


相关问题
HarmonyOS 音频处理问题
830浏览 • 1回复 待解决
HarmonyOS PixelMap位图处理问题
744浏览 • 1回复 待解决
HarmonyOS emitter事件处理问题
1088浏览 • 1回复 待解决
HarmonyOS 字符串处理问题
989浏览 • 1回复 待解决
网络请求数据处理问题
1287浏览 • 1回复 待解决
HarmonyOS 弹窗的后退手势处理问题
858浏览 • 1回复 待解决
HarmonyOS RN onBackP ress() 返回处理问题
1110浏览 • 1回复 待解决
HarmonyOS Refresh跟list组件惯性滑动问题
849浏览 • 1回复 待解决
Canvas制作图表如何实现滑动惯性
1291浏览 • 1回复 待解决
仿射变换后列表滑动问题
974浏览 • 1回复 待解决
列表滑动鸿蒙推荐ux设计
2589浏览 • 1回复 待解决
滑动嵌套事件冲突处理
1025浏览 • 0回复 待解决
键盘拉起时列表无法上下滑动
2905浏览 • 1回复 待解决
HarmonyOS swiper怎么添加惯性
459浏览 • 1回复 待解决