概述
在开始说明Scaffold组件之前,先大致讲述一下Material Design风格。Material Design也成为纸墨设计风格,是由Google退出的全新的设计语言,这种设计语言旨在为手机、平板电脑、台式机和其他平台提供更一致、更广泛的外观和感觉,它是一种非常有质感的设计风格,并会提供一些默认的交互动画。
Scaffold实现了基本的Material Design布局。只要是在Material Design中定义过的单个界面实现的布局元素,都可以使用Scaffold来绘制。
Scaffold属性
Scaffold常用的属性如下:
属性名 | 类型 | 说明 |
---|---|---|
appBar | AppBar | 显示在界面顶部的一个AppBar |
body | Widget | 当前界面所显示的主要内容 |
floatingActionButton | Widget | 在Material Design 中定义的一个功能 |
persistentFooterButtons | List | 固定在下方显示的按钮 |
drawer | Widget | 侧边栏组件 |
bottomNavigationBar | Widget | 显示在底部的导航栏按钮 |
backgroundColor | Color | 当前界面所显示的主要内容 |
body | Widget | 背景色 |
resizeToAvoidBottomPadding | bool | 控制界面内容body是否重新布局来避免底部被覆盖,比如当键盘显示时,重新布局避免被键盘盖住内容。默认值为true |
源码
class Scaffold extends StatefulWidget {
const Scaffold({
Key key,
this.appBar,
this.body,
this.floatingActionButton,
this.floatingActionButtonLocation,
this.floatingActionButtonAnimator,
this.persistentFooterButtons,
this.drawer,
this.endDrawer,
this.bottomNavigationBar,
this.bottomSheet,
this.backgroundColor,
this.resizeToAvoidBottomPadding,
this.resizeToAvoidBottomInset,
this.primary = true,
this.drawerDragStartBehavior = D