4、MaterialApp和Scaffold

MaterialApp和Scaffold是Flutter提供的两个Widget,其中:

  • MaterialApp是一个方便的Widget,它封装了应用程序实现Material Design所需要的一些Widget。(参考)
  • Scaffold组件是Material Design布局结构的基本实现。此类提供了用于显示drawer、snackbar和底部sheet的API。(参考)

代码:

  @override
  Widget build(BuildContext context) {
    initData();
    return new MaterialApp(
      theme: new ThemeData(
        // 设置主题颜色
        primaryColor: const Color(0xFF63CA6C)
      ),
      home: new Scaffold(
        // 设置App顶部的AppBar
        appBar: new AppBar(
          // AppBar的标题
          title: new Text(appBarTitles[_tabIndex], 
          // 标题文本的颜色
          style: new TextStyle(color: Colors.white)),
          // AppBar上的图标的颜色
          iconTheme: new IconThemeData(color: Colors.white)
        ),
        body: _body,
        // 页面底部的导航栏
        bottomNavigationBar: new CupertinoTabBar(
          items: <BottomNavigationBarItem>[
            new BottomNavigationBarItem(
                icon: getTabIcon(0),
                title: getTabTitle(0)),
            new BottomNavigationBarItem(
                icon: getTabIcon(1),
                title: getTabTitle(1)),
            new BottomNavigationBarItem(
                icon: getTabIcon(2),
                title: getTabTitle(2)),
            new BottomNavigationBarItem(
                icon: getTabIcon(3),
                title: getTabTitle(3)),
          ],
          currentIndex: _tabIndex,
          // 底部Tab的点击事件处理
          onTap: (index) {
            setState((){
              _tabIndex = index;
            });
          },
        ),
        // 侧滑菜单,这里的MyDrawer是自定义的Widget
        drawer: new MyDrawer(),
      ),
    );
  }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • afinalAfinal是一个android的ioc,orm框架 https://github.com/yangf...
    wgl0419阅读 6,323评论 1 9
  • afinalAfinal是一个android的ioc,orm框架 https://github.com/yangf...
    passiontim阅读 15,489评论 2 45
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 172,991评论 25 708
  • 很多人都希望能从事这样一种工作: ·钱很多,能帮助自己尽快实现财务自由; ·是自己喜欢的职业,每天叫醒自己去上班的...
    筑梦小兵阅读 949评论 2 4
  • 那片海/那座山/那个遥远的她 那栈桥/那艘船/那个远方的向往 那棵树/那朵花/那一枚相思的红叶 潮涨潮落,那一种坚...
    悦读漫笔阅读 478评论 0 2