HarmonyOS List组件的scrolltoIndex使用时nestedScroll配置不生效

父List和子List嵌套,子List设置了:

.nestedScroll({
  scrollForward: NestedScrollMode.PARENT_FIRST,
  scrollBackward: NestedScrollMode.SELF_FIRST
})

手动滑动子List时候父List可以联动,但是用子 List的scroller scrolltoIndex调用时候,只有子List在动,父List不动,与手动滑动时效果不一致。

HarmonyOS
2024-12-25 12:29:14
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
put_get
@Entry
@Component
struct Page2 {
  @State messageArr: string[] = ['1', '2', '3', '4', '5', '6', '7']
  scroller: Scroller = new Scroller()
  @State currentIndex: number = 1
  scroller2: Scroller = new Scroller()

  build() {
    Column() {
      List({ initialIndex: 1, scroller: this.scroller }) {
        ListItem() {
          Column() {
            Text('second floor')
            Button('to index 1').onClick(() => {
              this.scroller.scrollToIndex(1, true, ScrollAlign.CENTER)
            })
          }
        }
        .height('100%')
        .width('100%')
        .backgroundColor(Color.Grey)

        ListItem() {
          Column() {
            Row() {
              Text('点击操作').onClick(() => {
                this.scroller.scrollToIndex(0, true, ScrollAlign.CENTER)
                this.scroller2.scrollToIndex(0, true, ScrollAlign.CENTER)
              })
            }
            .height(100)
            .width('100%')
            .backgroundColor(Color.Pink)

            List({ scroller: this.scroller2 }) {
              ForEach(this.messageArr, (item: string) => {
                ListItem() {
                  Row() {
                    Text(`message ${item}`)
                  }
                  .width('100%')
                  .height('200vp')
                }
              })
            }
            .divider({ strokeWidth: 2 })
            .backgroundColor('#eee')
            .nestedScroll({
              scrollBackward: NestedScrollMode.SELF_FIRST,
              scrollForward: NestedScrollMode.PARENT_FIRST,
            })
            .padding({
              bottom: 100
            })
            .edgeEffect(EdgeEffect.None)
          }

        }
        .width('100%')
        .height('100%')

      }
      .friction(2)
      .edgeEffect(EdgeEffect.None)
      .scrollSnapAlign(ScrollSnapAlign.CENTER)
      .onScrollFrameBegin((offset, state) => {
        if (state === ScrollState.Fling) {
          return { offsetRemain: 0 }
        }
        return { offsetRemain: offset }
      })
      .onScrollIndex((start, end, center) => {
        this.currentIndex = center
      })
      .onTouch((event: TouchEvent) => {
        let touchObject: TouchObject = event.touches[0]
        if (touchObject.type === TouchType.Up) {
          this.scroller.scrollToIndex(this.currentIndex, true, ScrollAlign.CENTER)
        }
      })

    }
    .height('100%')
    .width('100%')
  }
}
分享
微博
QQ
微信
回复
2024-12-25 15:44:29
相关问题
List组件initialIndex属性设置生效
2384浏览 • 1回复 待解决
HarmonyOS list scrollToIndex
136浏览 • 1回复 待解决
abiFilters配置生效
673浏览 • 1回复 待解决
HarmonyOS 编译器配置生效
715浏览 • 1回复 待解决
HarmonyOS Web组件borderRadius生效
299浏览 • 1回复 待解决
容器组件onVisibleAreaChange生效
2139浏览 • 1回复 待解决
HarmonyOS 组件切换深色模式生效
592浏览 • 1回复 待解决
HarmonyOS ArkWeb组件加载url生效
308浏览 • 1回复 待解决
使用position之后height生效
2556浏览 • 1回复 待解决
Web组件onKeyEvent键盘事件生效
2129浏览 • 1回复 待解决
HarmonyOS LIst组件UI刷新
71浏览 • 1回复 待解决