flutter tabBar 的属性及自定义实现

在Flutter中，TabBar是一个经常用于构建带有标签的底部导航栏的组件。它通常与TabBarView一起使用，后者是一个可以包含多个页面的容器，用于展示与当前选中的标签对应的内容。

以下是TabBar的一些常用属性及其使用示例：

1. tabs：这是一个必须的属性，它接收一个List，里面包含了所有的Tab对象。
2. controller：控制器，可以用来通过代码控制标签栏的当前选项。
3. isScrollable：如果标签过多无法在一屏内显示，是否允许滚动。
4. indicatorColor：标签指示器（下划线）的颜色。
5. indicatorWeight：标签指示器的高度。
6. indicatorPadding：标签指示器内部边距。
7. indicator：自定义指示器的样式。
8. labelColor：标签的文字颜色。
9. labelStyle：标签的文字样式。
10. labelPadding：标签内部边距。
11. unselectedLabelColor：未选中标签的文字颜色。
12. unselectedLabelStyle：未选中标签的文字样式。

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 3,
        child: Scaffold(
          appBar: AppBar(
            title: Text('TabBar Example'),
            bottom: TabBar(
              indicatorColor: Colors.black,
              indicatorWeight: 5.0,
              tabs: <Widget>[
                Tab(text: 'Tab 1'),
                Tab(text: 'Tab 2'),
                Tab(text: 'Tab 3'),
              ],
            ),
          ),
          body: TabBarView(
            children: <Widget>[
              Center(child: Text('Tab 1 Content')),
              Center(child: Text('Tab 2 Content')),
              Center(child: Text('Tab 3 Content')),
            ],
          ),
        ),
      ),
    );
  }
}

在这个例子中，我们创建了一个包含3个标签的TabBar，每个标签对应一个页面的内容展示。DefaultTabController是用来管理标签状态的，它需要设置length属性以指定标签的数量，child是包含TabBar和TabBarView的Scaffold。我们还自定义了indicatorColor和indicatorWeight来改变指示器的样式。