Flutter的AppBar和TabController

class Home extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    // TODO: implement build

    return DefaultTabController(

      length: 3, //tab标签的个数

      child: Scaffold(

        backgroundColor: Colors.grey[100],//背景色

        appBar: AppBar(

          leading: IconButton(

            //导航栏左侧小图标

            icon: Icon(Icons.menu),

            tooltip: 'Navigation',

            onPressed: () => debugPrint('Navigation button is pressed'),

          ),

          title: Text('NingHao'), //导航栏的标题文字

          actions: [

            //导航栏右侧的小图标

            IconButton(

              icon: Icon(Icons.search),

              tooltip: 'Search',

              onPressed: () => debugPrint('Search button is pressed'),

            ),

          ],

          elevation: 0.0, //导航栏下面的阴影高度

          bottom: TabBar(

            unselectedLabelColor: Colors.black38,    //tab标签未选中时的颜色

            indicatorColor: Colors.black54,          //标签指示器的颜色

            indicatorSize: TabBarIndicatorSize.label, //标签指示器的宽度

            indicatorWeight: 1.0,                    //标签指示器的高度

            tabs: [  //标签设置

              Tab(icon: Icon(Icons.local_florist)),

              Tab(icon: Icon(Icons.change_history)),

              Tab(icon: Icon(Icons.directions_bike)),

            ],

          ),

        ),

        body: TabBarView(//标签对应的View的设置

          children: [

            Icon(Icons.local_florist, size: 128.0, color: Colors.black12),

            Icon(Icons.change_history, size: 128.0, color: Colors.black12),

            Icon(Icons.directions_bike, size: 128.0, color: Colors.black12),

          ],

        ),

      ),

    );

  }

}

image