第 2-2 课：导航组件详解（TabBar、NavigationBar、PageView 相关）

这节课将继续讲解 Flutter 的常用组件，前面已经给大家介绍了 Flutter 系列 Widget，今天讲解导航相关的组件。在 Android 的 Material Design 中，一般是底部使用 TabBar 实现底部导航或者顶部使用 TabBar、TabLayout 结合 ViewPager 来实现导航，那么在 Flutter 里我们如何实现这种效果呢？这节课我们就给大家分析相关组件，并结合案例进行用法讲解。

本文将主要介绍：

• TabBar 和 TabBarView Widget 用法详解
• BottomNavigationBar Widget 用法详解
• CupertinoTabBar 和 PageView Widget 用法详解
• BottomAppBar Widget 用法详解

TabBar 和 TabBarView Widget 用法详解

TabBar 和 TabBarView 一般是搭配使用，TabBar 用来实现 Tab 导航部分，TabBarView 用来实现 body 内容区域部分。TabBar 继承自 StatefulWidget，是一个有状态组件。TabBarView 同样也是继承自 StatefulWidget。

我们看下 TabBar 实现的效果：

来看下 TabBar 的构造方法：

const TabBar({
    Key key,
    // tab页Widget集合，可以使用Tab组件或者其他组件
    @required this.tabs,
    // TabController对象࿰