HarmonyOS NEXT 底部选项卡功能

@Entry@Componentstruct BottomTabExample {  controller: TabsController = new TabsController()  @State current: number = 0
  tabBuilder($$: { index: number; label: string; normalIcon: Resource; selectIcon: Resource }) {    Column() {      Image(this.current === $$.index ? $$.selectIcon : $$.normalIcon).width(26)      Text($$.label)        .fontSize('12fp')        .fontColor(this.current === $$.index ? '#62C9D0' : '#909090')        .margin({ top: 3 })    }    .width('100%')    .onClick(() => {      this.current = $$.index      this.controller.changeIndex(this.current)    })  }
  build() {    Column() {      Tabs({ barPosition: BarPosition.End, controller: this.controller }) {        TabContent() {          Text('首页的内容')        }.tabBar(this.tabBuilder({          index: 0,          label: '首页',          normalIcon: $r('app.media.tabbar11'),          selectIcon: $r('app.media.tabbar12')        }))        TabContent() {          Text('发现的内容')        }.tabBar(this.tabBuilder({          index: 1,          label: '发现',          normalIcon: $r('app.media.tabbar21'),          selectIcon: $r('app.media.tabbar22')        }))        // ... 其他TabContent配置      }      .width('100%')      .barMode(BarMode.Fixed)      .scrollable(true)      .onChange(((index: number) => {        this.current = index      }))    }    .width('100%')    .backgroundColor('#f2f2f2')  }}