设置tabs左对齐可以参考以下demo:@Entry @Component struct Index { @State message: string = 'HelloWorld'; private tabsController: TabsController = new TabsController() @State currentIndex: number = 0; @Builder TabBarBuilder(title: string, targetIndex: number) { Text(title).fontWeight(targetIndex === this.currentIndex ? FontWeight.Bold : FontWeight.Normal).margin({ left: 10, right: 10 }) .onClick(() => { this.tabsController.changeIndex(targetIndex) }) } build() { Row() { Column() { Flex({ direction: FlexDirection.Row }) { this.TabBarBuilder('页签1', 0) this.TabBarBuilder('页签2', 1) this.TabBarBuilder('页签3', 2) } Tabs({ barPosition: BarPosition.End, controller: this.tabsController }) { TabContent() { Text("页签1页面") } TabContent() { Text("页签2页面") } TabContent() { Text("页签3页面") } }.onChange((index: number) => { this.currentIndex = index; }) } } } }
设置tabs左对齐可以参考以下demo: