代码语言:javascript复制
class DialogPage extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _DialogPageState();
}
}
class _DialogPageState extends State<DialogPage> {
_alertDialog() async {
var result = await showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text('这是一个Dialog标题'),
content: Text('这是内容'),
actions: <Widget>[
FlatButton(
child: Text(
'取消',
style: TextStyle(color: Colors.cyan),
),
onPressed: () {
Navigator.pop(context, "取消"); //进行关闭,并且将数据传递给result,以下所有做法均一致。
},
),
FlatButton(
child: Text(
'确定',
style: TextStyle(color: Colors.red),
),
onPressed: () {
Navigator.pop(context, "确定"); //进行关闭
},
),
],
);
});
print(result);
}
_simpleDialog() async {
var result = await showDialog(
context: context,
builder: (context) {
return SimpleDialog(
title: Text('选择对应内容'),
children: <Widget>[
SimpleDialogOption(
child: Text('Option A'),
onPressed: () {
Navigator.pop(context, 'A');
},
),
Divider(),
SimpleDialogOption(
child: Text('Option B'),
onPressed: () {
Navigator.pop(context, 'B');
},
),
Divider(),
SimpleDialogOption(
child: Text('Option C'),
onPressed: () {
Navigator.pop(context, 'C');
},
),
],
);
});
print(result);
}
_modelBottomSheet() async {
var result = await showModalBottomSheet(
context: context,
builder: (context) {
return Container(
height: 200,//不设置默认高度为一半
child: Column(
children: <Widget>[
ListTile(
title: Text('分享A'),
onTap: (){
Navigator.pop(context,'A');
},
),
ListTile(
title: Text('分享B'),
onTap: (){
Navigator.pop(context,'B');
},
),
ListTile(
title: Text('分享C'),
onTap: (){
Navigator.pop(context,'C');
},
),
],
),
);
},
);
print(result);
}
_toast() {
Fluttertoast.showToast(
msg: "This is Center Short Toast",
toastLength: Toast.LENGTH_SHORT,
gravity: ToastGravity.CENTER, //设置显示位置
timeInSecForIos: 1, //只在ios上有效,
backgroundColor: Colors.red,
textColor: Colors.white,
fontSize: 16.0
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Dialog演示'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('AlertDilaog'),
onPressed: () {
_alertDialog();
},
),
RaisedButton(
child: Text('SimpleDialog'),
onPressed: () {
_simpleDialog();
},
),
RaisedButton(
child: Text('ActionSheet底部弹出框-showModalBottomSheet'),
onPressed: () {
_modelBottomSheet();
},
),
RaisedButton(
child: Text('Toast第三方库-fluttertoast'),
onPressed: () {
_toast();
},
),
],
),
),
);
}
}
其中我们用到的第三方Toast,移步去这里看文档。这里就不进行详解了
自定义Dialog
自定义Dialog的步骤:
- 自定义类继承
Dialog
类 - 重写
build
方法,并且最外层return Material()
- 在调用时,与其他Dialog一直,通过
showDialog( context: context, builder: (context){ return 自定义Dialog(); } );
自定义提示dialog类
代码语言:javascript复制class MyDialog extends Dialog{
@override
Widget build(BuildContext context) {
// TODO: implement build
return Material(
type: MaterialType.transparency, //设置透明度
child: Center(
child: Container(
width: 200,
height: 200,
color: Colors.white,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Row(
children: <Widget>[
Expanded(flex: 1,child: Text('1111',textAlign: TextAlign.center,),),
InkWell(
child:Icon(Icons.close),
onTap: (){
Navigator.pop(context);
}
),
],
),
Divider(),
Container(
width: double.infinity,
child: Text('22312',textAlign: TextAlign.left),
),
],
),
),
),
);
}
}
使用时:
代码语言:javascript复制 RaisedButton(
child: Text('自定义Dialog),
onPressed: () {
// _toast();
showDialog(
context: context,
builder: (context){
return MyDialog();
}
);
},
),