AppBar --> tabBar问题

143 阅读1分钟
// 如果是StatefulWidget的类需要继承 SingleTickerProviderStateMixin
// 如果是StatelessWidget的类需要在Scaffold上添加一层DefaultTabController,不用在init中初始化
// 下面演示StatefulWidget中的使用
class _HomeViewState extends State<HomeView with SingleTickerProviderStateMixin{
    // 初始化 tabController, 写在init里面
  TabController _tabController;
  @override
  void initState() {
    super.initState();
     _tabController = TabController(length: 2, vsync: this);
  }
    ...
    appBar: AppBar(
      title: TabBar(
        isScrollable: true,  // 设置可滚动,不然文字超出会被挤压
        controller: _tabController,  // 需要关联_tabController
        tabs: <Widget>[
          Text('HomeList 1'),
          Text('HomeList 2'),
        ],
      ),
    ), 
    body: TabBarView(
      controller: _tabController,  // 需要关联_tabController
      children: <Widget>[
        HomeList(data: '1'),
        HomeList(data: '2'),
      ],
    ),
    ...
}
    # tabBar的一些属性
    this.controller,//TabController对象
    this.isScrollable = false,//是否可滚动
    this.indicatorColor,//指示器颜色
    this.indicatorWeight = 2.0,//指示器高度
    this.indicatorPadding = EdgeInsets.zero,//底部指示器的Padding
    this.indicator,//指示器decoration,例如边框等
    this.indicatorSize,//指示器大小计算方式,TabBarIndicatorSize.label跟文字等宽,TabBarIndicatorSize.tab跟每个tab等宽
    this.labelColor,//选中label颜色
    this.labelStyle,//选中label的Style
    this.labelPadding,//每个label的padding值
    this.unselectedLabelColor,//未选中label颜色
    this.unselectedLabelStyle,//未选中label的Style