HarmonyOS listitem有直接返回index的方法吗?

目前List里样式众多,很多listitem通过if来判断是否展示的,想要通过点击外部button让列表自动滚动到相应的item处。

HarmonyOS
2024-10-12 11:26:59
浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
Heiang

点击外部button让列表自动滚动到相应的item处,可以通过:

1.声明: scroller: Scroller = new Scroller();

2.绑定:List({ space: 20, initialIndex: 0,scroller:this.scroller }) {} (如果你是跳转到新的页面可以直接通过初始index:initialIndex来设置)

3.点击button的时候执行: this.scroller.scrollToIndex(想跳转的index,true);

参考demo:

@Entry  
@Component  
struct ListItemExample {  
  scroll: ListScroller = new ListScroller()  
  listIndex: number = 0  
  targetObj: Record<string, number> = {}  
  articleDetail: ESObject = {  
    header: 'header1',  
    content1: 'cont1',  
    content2: '',  
    content3: 'cont3',  
    footer: 'footer1'  
  }  
  @Builder  
  TextBuild(name: string) {  
    Text('' + name)  
      .width('100%')  
      .height(400)  
      .fontSize(16)  
      .textAlign(TextAlign.Center)  
      .borderRadius(10)  
      .backgroundColor(0xFFFFFF)  
  }  
  getTargetIndex(index: number): boolean {  
    this.targetObj[index] = this.listIndex  
    this.listIndex++  
    return true  
  }  
  build() {  
    Stack({ alignContent: Alignment.Bottom }) {  
      List({ space: 20, initialIndex: 0, scroller: this.scroll }) {  
        if (this.articleDetail.header && this.getTargetIndex(0)) {  
          ListItem() {  
            this.TextBuild(this.articleDetail.header)  
          }  
        }  
        if (this.articleDetail.content1 && this.getTargetIndex(1)) {  
          ListItem() {  
            this.TextBuild(this.articleDetail.content1)  
          }  
        }  
        if (this.articleDetail.content2 && this.getTargetIndex(2)) {  
          ListItem() {  
            this.TextBuild(this.articleDetail.content2)  
          }  
        }  
        if (this.articleDetail.content3 && this.getTargetIndex(3)) {  
          ListItem() {  
            this.TextBuild(this.articleDetail.content3)  
          }  
        }  
        if (this.articleDetail.footer && this.getTargetIndex(4)) {  
          ListItem() {  
            this.TextBuild(this.articleDetail.footer)  
          }  
        }  
      }.width('90%')  
      .height('100%')  
      .scrollBar(BarState.Off)  
      Button('click').onClick(() => {  
        console.log('targetObj' + JSON.stringify(this.targetObj), this.targetObj[3])  
        this.scroll.scrollToIndex(this.targetObj[3], true)  
      })  
    }.width('100%').height('100%').backgroundColor(0xDCDCDC).padding({ 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.
分享
微博
QQ
微信
回复
2024-10-12 16:47:48
相关问题
HarmonyOS ArrayListaddAll方法
734浏览 • 1回复 待解决
LocalParticleAbility替代方法
3767浏览 • 1回复 待解决
c++侧可以直接调用tsstatic方法
3139浏览 • 1回复 待解决
HarmonyOS ArkTS类似bigdecimal方法
1184浏览 • 1回复 待解决
HarmonyOS通过方法调用loading
1185浏览 • 0回复 待解决
HarmonyOS HMAC加密对应方法
1134浏览 • 1回复 待解决
那种公共标题返回标题控件
2170浏览 • 1回复 待解决
MySQL escape方法问题了解
3350浏览 • 1回复 待解决
HarmonyOS 设置字体全局方法
1060浏览 • 1回复 待解决
提问
该提问已有0人参与 ,帮助了0人