HarmonyOS 如何获取List组件当前已经滑动的距离

HarmonyOS
2天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
fox280

可以通过currentOffset来实现,参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-components-container-list-V5#%E6%96%B9%E6%B3%95

参考demo:

@Entry
@Component
struct ListExample {
  private arr: number[] = []
  private scrollerForList: Scroller = new Scroller()

  aboutToAppear() {
    for (let i = 0; i < 20; i++) {
      this.arr.push(i)
    }
  }
  build() {
    Column() {
      Row() {
        List({ space: 20, initialIndex: 3, scroller: this.scrollerForList }) {
          ForEach(this.arr, (item: number) => {
            ListItem() {
              Text("" + item)
                .width("100%").height(100).fontSize(16)
                .textAlign(TextAlign.Center)
            }
            .borderRadius(10).backgroundColor(0xFFFFFF)
            .width("60%")
            .height("80%")
          }, (item: number) => JSON.stringify(item))
        }
        .onScroll(()=>{
          console.log(this.scrollerForList.currentOffset().xOffset+  this.scrollerForList.currentOffset().xOffset.toString())
        })
        .chainAnimation(true)
        .edgeEffect(EdgeEffect.Spring)
        .listDirection(Axis.Horizontal)
        .height("100%")
        .width("100%")
        .scrollSnapAlign(ScrollSnapAlign.CENTER)
        .borderRadius(10)
        .backgroundColor(0xDCDCDC)
      }
      .width("100%")
      .height("100%")
      .backgroundColor(0xDCDCDC)
      .padding({ top: 10 })
    }
  }
}
分享
微博
QQ
微信
回复
2天前
相关问题
如何监听List组件滑动距离
2185浏览 • 1回复 待解决
如何获取List组件滚动条滚动距离
2603浏览 • 1回复 待解决
HarmonyOS 组件List如何禁止滑动
37浏览 • 1回复 待解决
HarmonyOS如何去掉List组件滑动线
926浏览 • 1回复 待解决
HarmonyOS 监听List组件滑动
56浏览 • 1回复 待解决
HarmonyOS list组件如何设置匀速滑动
58浏览 • 1回复 待解决
Tabs滑动距离问题有哪些?
380浏览 • 1回复 待解决
如何获取当前组件宽度?
310浏览 • 1回复 待解决
HarmonyOS如何拦截list滑动事件?
422浏览 • 1回复 待解决
如何屏蔽List滑动事件
2435浏览 • 1回复 待解决
HarmonyOS List联动滑动
61浏览 • 1回复 待解决