HarmonyOS 电台波动效果

尝试下list的onScrollIndex方法。

api参考地址：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-list-V5#onscrollindex

参考代码如下：

@Entry
@Component
struct Index21 {
  @State message: string = 'Hello World';
  private scrollerForScroll: Scroller = new Scroller()
  private scrollerForList: Scroller = new Scroller()
  private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

  build() {
    Row() {
      Column() {
        Flex() {
          Scroll(this.scrollerForScroll) {
            Column() {
              List({ scroller: this.scrollerForList }) {
                ForEach(this.arr, (item: number) => {
                  ListItem() {
                    Text("ListItem" + item)
                      .width(60)
                      .height(60)
                      .borderRadius(15)
                      .fontSize(16)
                      .textAlign(TextAlign.Center)
                      .backgroundColor(Color.White)
                  }.height(80).margin({ left: 10, right: 10, top: 10 })
                }, (item: string) => item)
              }
              .onScrollIndex((firstIndex: number, lastIndex: number, centerIndex: number) => {
                console.info('first' + firstIndex)
                console.info('last' + lastIndex)
                console.info('center' + centerIndex)
              })
              .width("100%")
              .height("100%")
              .edgeEffect(EdgeEffect.None)
              .friction(0.6)
              .listDirection(Axis.Horizontal)
            }
          }.width("100%").height("100%")
          .edgeEffect(EdgeEffect.None)
        }.width('100%').height('100%').backgroundColor(0xDCDCDC)
      }.width('100%')

    }.height('100%')
  }
}