HarmonyOS List设置divider如何在list顶部和底部增加分割线?

如题:HarmonyOS List设置divider如何在list顶部和底部增加分割线?

阅读 472
1 个回答

目前List自带的.divider属性无法设置List顶部和底部的分割线,您可以通过Divider组件来自定义分隔线,示例如下:

ForEach(this.arr, (item: number,index:number) => {

  ListItem() {
    Column(){
      if (index == 0) {
        Divider().height(2)
          .margin({left:20,right:20,top:10,bottom:10})
          .backgroundColor(Color.Brown)
      }
      Row(){

        Text('' + item)
          .width('100%').height(100).fontSize(16)
          .textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF)
      }
      Divider().height(2)
        .margin({left:20,right:20,top:10,bottom:10})
        .backgroundColor(Color.Brown)
    }

  }
}, (item: string) => item)