那个's it, your job is done ! You can optionally now add a custom close event. For this, you' ll只需要调用 Navigator.pop(context) . 但是模态和非模态底页都可以使用常见手势开箱即用 . 如后退按钮,导航栏后退,点击外部 .
完整示例:
class MyExample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Scaffold(
appBar: new AppBar(title: new Text('Example')),
body: new Center(
child: new Builder(builder: (context) {
return new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new RaisedButton(
onPressed: () => modal(context),
child: new Text("modal"),
),
new RaisedButton(
onPressed: () => showSlideupView(context),
child: new Text("non modal"),
),
],
);
}),
),
),
);
}
void showSlideupView(BuildContext context) {
showBottomSheet(
context: context,
builder: (context) {
return new Container(
child: new GestureDetector(
onTap: () => Navigator.pop(context),
child: new Text("Click me to close this non-modal bottom sheet"),
),
);
});
}
modal(BuildContext context) {
showModalBottomSheet(
context: context,
builder: (context) {
return new Container(
child: new Text("This is a modal bottom sheet !"),
);
});
}
}
1 回答
Draggable(和DragTarget)不用于您所谓的
slide-up view
来自android世界的
slide-up view
是针对底部对齐的模态 .Draggable
是使用拖放传输数据 .在颤动中,底部模态非常简单:
首先,确保你的树上面有一个
Scaffold
. 因为它将把所有东西放在一起 .然后,使用您喜欢的任何内容调用
showBottomSheet
或showModalBottomSheet
. 内容现在将自动显示在屏幕底部 .那个's it, your job is done ! You can optionally now add a custom close event. For this, you' ll只需要调用
Navigator.pop(context)
. 但是模态和非模态底页都可以使用常见手势开箱即用 . 如后退按钮,导航栏后退,点击外部 .完整示例: