lutter中一切皆widget,这和RN中一切皆组件的思想很相似,所以在学习Flutter中,咱们必须首先来了解Flutter的widget.下面先从最基本的MaterialApp和Scaffold开始了解app
1 MaterialApp
一个封装了不少Android MD设计所必需要的组件的小部件,通常做为顶层widget使用。less
继承关系
Inheritance
Object->Diagnosticable ->DiagnosticableTree ->Widget ->StatefulWidget ->MaterialApp布局
通常与如下widget一块儿使用
Scaffold: Material Design布局结构的基本实现。此类提供了用于显示drawer、snackbar和底部sheet的API。
Navigator,用于管理应用程序的页面堆栈。
MaterialPageRoute,它定义以特定于材料的方式转换的应用页面。
WidgetsApp,它定义基本的app元素但不依赖于材质库。学习
通常来讲,在Flutter中,咱们若是遵循MD设计时,顶层的Widget通常是MaterialApp,这里面咱们能够指定主题样式,以便应用与APP整个页面中设计
2 Scaffold
Material Design布局结构的基本实现。此类提供了用于显示drawer、snackbar和底部sheet的API。
简单来讲,Scanold就是一个提供MD设计中基本布局的widget,包括最上面的appBar,body,以及下部的drawer,snackbar等继承
继承关系
Object –>Diagnosticable ->DiagnosticableTree ->Widget ->StatefulWidget ->Scaffoldget
经常使用元素
appBar 标题栏
backgroundColor 背景色
body 内容区
it