AlertDialog
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
class AlertDialogDemo extends StatefulWidget {
@override
_AlertDialogDemoState createState() => _AlertDialogDemoState();
}
enum Action { Cancel, OK }
class _AlertDialogDemoState extends State<AlertDialogDemo> {
String _choice = 'Nothing';
Future _openAlertDialog() async {
final action = await showDialog(
context: context,
barrierDismissible: false, // 点击提示框外围不消失
builder: (BuildContext context) {
return AlertDialog(
title: Text('AlertDialog'),
content: Text('Are you sure about this ?'),
actions: <Widget>[
FlatButton(
child: Text('Cancel'),
onPressed: () {
Navigator.pop(context, Action.Cancel);
},
),
FlatButton(
child: Text('OK'),
onPressed: () {
Navigator.pop(context, Action.OK);
},
),
],
);
});
switch (action) {
case Action.OK:
setState(() {
_choice = 'OK';
});
break;
case Action.Cancel:
setState(() {
_choice = 'Cancel';
});
break;
default:
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('AlertDialogDemo'),
elevation: 0.0,
),
body: Container(
padding: EdgeInsets.all(16.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('Your choice is : $_choice'),
SizedBox(height: 16.0),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('Open AlertDialog'),
onPressed: _openAlertDialog,
),
],
)
],
),
),
);
}
}
弹出的底部sheet，有模态和非模态两种
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
class BottomSheetDemo extends StatefulWidget {
@override
_BottomSheetDemoState createState() => _BottomSheetDemoState();
}
class _BottomSheetDemoState extends State<BottomSheetDemo> {
final _BottomSheetScaffoldKey = GlobalKey<ScaffoldState>();
Future _openModelBottomSheet() async {
final option = await showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return Container(
height: 200,
child: Column(
children: <Widget>[
ListTile(
title: Text('Option A'),
onTap: () {
Navigator.pop(context, 'A');
},
),
ListTile(
title: Text('Option B'),
onTap: () {
Navigator.pop(context, 'B');
},
),
ListTile(
title: Text('Option C'),
onTap: () {
Navigator.pop(context, 'C');
},
),
],
),
);
});
print(option);
}
_openBottomSheet() {
_BottomSheetScaffoldKey.currentState
.showBottomSheet((BuildContext context) {
return BottomAppBar(
child: Container(
height: 90.0,
width: double.infinity,
padding: EdgeInsets.all(16),
child: Row(
children: <Widget>[
Icon(Icons.pause_circle_outline),
SizedBox(width: 16.0),
Text('01:30/03:30'),
Expanded(
child: Text('Fix you - Coldplay', textAlign: TextAlign.right),
)
],
),
),
);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('BottomSheetDemo'),
elevation: 0.0,
),
key: _BottomSheetScaffoldKey,
body: Container(
padding: EdgeInsets.all(16.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
FlatButton(
child: Text('Open BottomSheet'),
onPressed: _openBottomSheet,
),
FlatButton(
child: Text('Open ModelBottomSheet'),
onPressed: _openModelBottomSheet,
)
],
),
),
);
}
}
SimpleDialog
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
class DialogDemo extends StatefulWidget {
@override
_DialogDemoState createState() => _DialogDemoState();
}
enum Option { A, B, C }
class _DialogDemoState extends State<DialogDemo> {
String _choice = 'Nothing';
@override
Widget build(BuildContext context) {
_openSimpleDialog() async {
final option = await showDialog(
context: context,
builder: (BuildContext context) {
return SimpleDialog(
title: Text('SimpleDialog'),
children: <Widget>[
SimpleDialogOption(
child: Text('Option A'),
onPressed: () {
Navigator.pop(context, Option.A);
},
),
SimpleDialogOption(
child: Text('Option B'),
onPressed: () {
Navigator.pop(context, Option.B);
},
),
SimpleDialogOption(
child: Text('Option C'),
onPressed: () {
Navigator.pop(context, Option.C);
},
),
],
);
},
);
switch (option) {
case Option.A:
setState(() {
_choice = 'A';
});
break;
case Option.B:
setState(() {
_choice = 'B';
});
break;
case Option.C:
setState(() {
_choice = 'C';
});
break;
default:
}
}
return Scaffold(
appBar: AppBar(
title: Text('ShowDialog'),
elevation: 0.0,
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.format_list_numbered),
onPressed: _openSimpleDialog,
),
body: Container(
padding: EdgeInsets.all(16.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('Your choice is : $_choice'),
],
),
],
),
),
);
}
}
过一会自动消失的SnackBar
import 'package:flutter/material.dart';
class SnackBarDemo extends StatefulWidget {
@override
_SnackBarDemoState createState() => _SnackBarDemoState();
}
class _SnackBarDemoState extends State<SnackBarDemo> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('SnackBarDemo'),
elevation: 0.0,
),
body: Container(
padding: EdgeInsets.all(16.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SnackbarButton(),
],
),
],
),
),
);
}
}
class SnackbarButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return FlatButton(
child: Text('Open SnackBa'),
onPressed: () {
Scaffold.of(context).showSnackBar(SnackBar(
content: Text('Processing'),
action: SnackBarAction(
label: 'OK',
onPressed: () {},
),
));
});
}
}
Tooltip不打断用户操作,停顿时间比较少的提示,长按显示提示
Tooltip(
message: '不要碰我,我怕痒',
child: Image.network('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1560316081080&di=de32c1eff5ca4ad78e8387d132d9109c&imgtype=0&src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F015e475725bd5432f875a399743555.png%401280w_1l_2o_100sh.png',
fit:BoxFit.cover,
scale: 2.0,
),
)
网友评论