用户登录

还有一种对话框形式的 BottomSheet .. 可以使用 showModalBottomSheet 这个方法打开 .. 先在界面上添加一个按钮 .. 直接复制一份 ... 按钮上的文字是 Modal BottomSheet .. 点按它的时候执行一下 _openModalBottomSheet ..

然后在上面再去定义一下这个方法 .. 名字是 _openModalBottomSheet .. 里面用一下 showModalBottomSheet 这个方法 .. 先要设置一下它的 context 属性,对应的值是 context .. 它还需要一个 builder 方法 .. 用它构建一下 BottomSheet 小部件 .. 一个 BuildContext 类型的 context 参数 .. 方法 return 的东西就是要在 BottomSheet 上显示的小部件 ..

一个 Contaienr .. 里面可以使用 height 设置一下这个容器的高度 .. 大小是 200.0 ... 再添加一个 child .. 用一个 Column 添加一栏内容 .. 这些内容可以放在 children 属性里面 ..

里面可以用一个 ListTile .. 添加一个 title 属性设置一下标题 .. 标题文字是 Option A ..

复制两份 ListTile .. 修改一下标题文字 .. Option B ... 下面这个是 Option C ..

下面到模拟器上去试一下 .. 按一下 Modal BottomSheet ,现在打开的就是一个对话框式的底部滑动窗口 .. 这种 BottomSheet 显示出来的时候就不能使用应用的其它界面上的东西了 .. 按一下空白的地方 .. 或者按一下这个 BottomSheet 上的小部件都可以关掉它 ..

BottomSheet:对话框式底部滑动窗口(showModalBottomSheet)《 Flutter 移动应用:对话框 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点