如何在脚手架上制作圆形标签？

Question

以下是我的模拟：

在这里，我寻求帮助来制作圆形制表符，分隔线以及用于制表符主体的空间。

对此进行了尝试： https://mightytechno.com/style-tabs-in-flutter-app/

（第一个选项，但仍然没有圆圈）

Answer 1

您的TabView控制器，类似这样

TabController _tabController = new TabController(length: 2, vsync: this);

您的身体会像

body :  ListView(
//Your TabBar would be something like this, not exactly

new TabBar (children:[
   new Column(children:[
      CircleAvatar(backgroundImage: new Image.asset('asset_location'),),
      Text('menu_item_name')
   ]),
   new Column(children:[
      CircleAvatar(backgroundImage: new Image.asset('asset_location'),),
      Text('menu_item_name')
   ]),
   new Column(children:[
      CircleAvatar(backgroundImage: new Image.asset('asset_location'),),
      Text('menu_item_name')
   ]),
]),

// Then your TabVieW starts here
Your TabView(controller: _tabController,
    children:[
    new Container(child: new Text('Tab1')) // Tab 1
    new Container(child: new Text('Tab2')) // Tab 2
    new Container(child: new Text('Tab3')) // Tab 3
])

Answer 2

尝试在Tab小部件内使用ClipOval小部件。

或者检查是否对bubble_tab_indicator有帮助。