Scaffold的五大组成部分：

AppBar标题栏

设置标题和左部右边图标

appBar: AppBar(
    leading: Icon(Icons.home),
    title: const Text("data"),
    actions: [
      Icon(Icons.password)
    ],
  ),

Body主体部分

这一部分主要承载展示给用户的主体部分。这里举一个NavigationButton和主体部分联动的例子。这里是嵌套了一个PageView，通过PageView可以实现左右滑动切换页面，并实现和NavigationButton联动，因为它们控制的是同一个全局变量currentPage。

body: PageView(
    controller: pageController,
    children: bodyList,
    onPageChanged: (index) {
      setState(() {
        currentPage = index;
      });
    },
  ),

NavigationButton部分

主要指定三个属性：

1. items：展示的按钮子项
2. currentIndex：当前点击的按钮子项，currentPage是一个全局的状态变量，通过改变它来更换页面和按钮
3. onTap：监听点击事件，处理按钮的切换。这个需要使用pageController的animateToPage方法。并借助setState()更改部件的状态

bottomNavigationBar: BottomNavigationBar(
    items: items,
    currentIndex: currentPage,
    onTap: (index) {
      pageController.animateToPage(index,
          duration: Duration(microseconds: 400),
          curve: Curves.easeInOutQuart);
      setState(() {
        currentPage = index;
      });
    },
  ),

一个小问题，就是当item的数量多余3个时，会默认设置bottonBar的type是移动的，我们希望它fixed固定，需要手动设置属性type

Drawer

drawer就是原生控件中的抽屉控件，可以使用它实现侧边栏的效果。

drawer: Drawer(
    child: ListView(
      padding: EdgeInsets.zero,
      children: [
        UserAccountsDrawerHeader(
            currentAccountPicture:
                Image(image: AssetImage('images/cat.jpg')),
            otherAccountsPictures: [
              Image(image: AssetImage('images/cat.jpg')),
              Image(image: AssetImage('images/cat.jpg')),
              Image(image: AssetImage('images/cat.jpg')),
            ],
            accountName: Text('starry'),
            accountEmail: Text("2495646304@qq.com")),
        
        ListTile(
          title: Text('用户设置'),
          trailing: Icon(Icons.keyboard_arrow_right),
          onTap: () {},
        ),
      ],
    ),
  ),

FloatingActionButton

注意浮动按钮的位置可以通过 floatingActionButtonLocation 属性设置，这个属性是Scaffold的子属性。

floatingActionButton: FloatingActionButton(
    onPressed: () {},
    child: Icon(Icons.add),
  ),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,