側滑菜單在安卓App裏面非常常見
抽屜通常與Scaffold.drawer屬性一起使用。抽屜的子項通常是ListView，其第一個子項是DrawerHeader ，它顯示有關當前用戶的狀態信息。其餘的抽屜兒童往往與構建ListTile S，經常有結束AboutListTile。
可以通過調用Navigator.pop關閉打開的抽屜
效果圖：
代碼：
/***
* Drwaer 側滑
*/
class DrawerDemo extends StatefulWidget {
@override
State<StatefulWidget> createState() {
// TODO: implement createState
return new DrawerMain();
}
}
class DrawerMain extends State<DrawerDemo> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: new Text("Drawer"),
),
drawer: new Drawer(
child: new ListView(
children: <Widget>[
new UserAccountsDrawerHeader(
accountName: Text("切切歆語"),
accountEmail: Text("[email protected]"),
currentAccountPicture: new GestureDetector(
child: new CircleAvatar(
backgroundImage: new ExactAssetImage("images/pic2.png"),
),
),
decoration: new BoxDecoration(
image: new DecorationImage(
fit: BoxFit.fill,
image: new ExactAssetImage("images/lake.jpg"),
),
),
),
new ListTile(
title: new Text("小花"),
trailing: new Icon(Icons.local_florist),
),
new ListTile(
title: new Text("搜索"),
trailing: new Icon(Icons.search),
onTap: () {},
),
new Divider(),//橫線
new ListTile(
title: new Text("設置"),
trailing: new Icon(Icons.settings),
onTap: () {
Navigator.of(context).pop();//點擊關閉側滑
_neverSatisfied();
},
),
],
),
),
body: new Center(
child: new Text(" Hello "),
),
);
}
}
官方文檔
https://docs.flutter.io/flutter/material/Drawer-class.html