Flutter -------- Drawer侧滑
侧滑菜单在安卓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("zhangqie@foxmail.com"),
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
Flutter -------- Drawer侧滑的更多相关文章
- Flutter Drawer 侧边栏、以及侧边栏内 容布局
Flutter Drawer 侧边栏 在 Scaffold 组件里面传入 drawer 参数可以定义左侧边栏,传入 endDrawer 可以定义右侧边 栏.侧边栏默认是隐藏的,我们可以通过手指滑动显示 ...
- Flutter - 左右侧滑菜单:drawer和endDrawer
侧滑菜单可以从左面滑出,也可以从右面滑出.在Scaffold中有drawer和endDrawer两个参数,分别对应左边的菜单和右边的菜单. drawer: new Drawer( child: new ...
- Flutter - 创建侧滑菜单(不使用navigatior,仅改变content)
之前写过一篇文章,Flutter - 创建横跨所有页面的侧滑菜单.这个里面中使用了Navigator.of(context).push来导航到新的页面. 这次介绍一种不使用导航,仅仅改变content ...
- Flutter - 创建侧滑菜单
侧滑菜单在安卓App里面非常常见,比如Gmail,Google Play,Twitter等.看下图 网上也有很多创建侧滑菜单的教程,我也来记录一下,自己学习创建Drawer的过程. 1. 创建一个空的 ...
- flutter drawer 自定义图标 icon 手动打开drawer
方法1:GlobalKey import "package:flutter/material.dart"; class Test extends StatefulWidget { ...
- Flutter——Drawer、DrawerHeader、UserAccountsDrawerHeader组件(侧边栏组件)
在 Scaffold 组件里面传入 drawer 参数可以定义左侧边栏,传入 endDrawer 可以定义右侧边栏.侧边栏默认是隐藏的,我们可以通过手指滑动显示侧边栏,也可以通过点击按钮显示侧边栏. ...
- Flutter -------- 新手 WanAndroid 项目练习
一个简单Flutter项目wanandroid,先前用Kotlin来开发过,适合新手练习. 用到的库 包含功能: http+数据解析 网络请求数据列表展示 Banner轮播 WebView跳转详情 D ...
- Drawer 侧边栏、以及侧边栏内 容布局
一.Flutter Drawer 侧边栏 在 Scaffold 组件里面传入 drawer 参数可以定义左侧边栏,传入 endDrawer 可以定义右侧边栏.侧边栏默认是隐藏的,我们可以通过手指滑动显 ...
- Flutter - 创建横跨所有页面的侧滑菜单
前一篇博客讲到了如何创建侧滑菜单,但是再实际使用过程中,会发现,这个策划菜单只能在首页侧滑出来. 当导航到其他页面后,侧滑就不管用了.这也有点不符合良好的用户体验设计.Google Play就是很好的 ...
随机推荐
- 基于STM8的IIC协议--实例篇--时钟模块(DS3231)读取
1. 综述 由上篇博客可知道IIC协议如何用代码实现,本篇博客就不涉及协议内容,只讲解如何使用. 本次的实验传感为:DS3231(时钟模块),对于时钟模块的具体信息我也就不多介绍,大家可以自行度娘,具 ...
- nginx 配置文件详解(转)
#运行用户 #user nobody; #启动进程,通常设置成和cpu的数量相等或者2倍于cpu的个数(具体结合cpu和内存).默认为1 worker_processes 1; #全局的错误日志和日志 ...
- java基础(11)---模块(java9)
一.模块介绍 二.模块可以解决的问题 三.module-info.java文件 四.一个项目就可变成一个模块
- destoon修改搜索页面标题方法
最近研究destoon内核开发,发现destoon6.0的搜索页面模块的标题太长,是搜索标题+模块+首页标题,这样导致标题过长,百度不喜欢,所以我经过修改成百度所喜欢的. 修改前截图: 修改的文件:/ ...
- 关于docker的UnionFS系统原理
docker镜像的结构就像花卷一样,是一层一层的,比如tomcat镜像,它有450M左右,但我们实际的tomcat却很小,为什么tomcat镜像那么大呢,是因为,tomcat镜像的最里面是kernel ...
- 3D-2D透视投影数学推导
请尊重作者,禁止私自盗用图片!
- 堆优化Prim 最小生成树 模板
#include <bits/stdc++.h> using namespace std; const int MAXN = 5005; const int MAXM = 200005; ...
- 计算 byte[] 转 int modebus 指定位数 获取值 使用
计算 byte[] 转 int modebus 指定位数 获取值 使用 if (bytetores.Length > 6) { int total = 0; for (int i = 0; i ...
- RegularExpression正则表达式
1.必須為大寫字母,小寫字母,數字和符號的至少其中3種組合 The new password should contain any three of different syntax which is ...
- 学校的信息课(备战会考)LZ没带笔……
IP地址 四段十进制数组成(四个字节,32个二进制位数,一个字节八位) 用“.”隔开 每一段的取值范围[0,255] 分类:看第一个字节(见到的大多为B,C类) A:1~126 B:128~19 ...