flutter dialog
flutter Dialog
import 'dart:math';
import 'package:flutter/material.dart';
import 'test.dart';
import 'package:flutter/cupertino.dart';
class HomePage extends StatelessWidget {
var selectedIndex = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Dialog'),
),
body: Builder(builder: (BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
RaisedButton(
child: Text('SimpleDialog'),
onPressed: () {
_showSimpleDialog(context);
},
),
RaisedButton(
child: Text('AlertDialog'),
onPressed: () {
_showAlertDialog(context);
},
),
RaisedButton(
child: Text('CupertinoAlertDialog'),
onPressed: () {
_showCupertinoAlertDialog(context);
},
),
RaisedButton(
child: Text('CustomDialog'),
onPressed: () {
_showCustomDialog(context);
},
),
RaisedButton(
child: Text('bottomSheet'),
onPressed: () {
_showBottomView(context);
},
),
RaisedButton(
child: Text('bottomSelectSheet'),
onPressed: () {
_showSelectionDialog(context);
},
),
],
),
);
}));
}
void _showBottomView(BuildContext context) {
var datas = List.generate(20, (index) {
return 'datas$index';
});
showModalBottomSheet(
context: context,
isScrollControlled: false,
builder: (ctx) {
return Container(
height: 200,
color: Colors.white,
child: Column(
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
FlatButton(
child: Text('取消'),
onPressed: () {
Navigator.pop(context);
},
),
FlatButton(
child: Text('确定'),
splashColor: Colors.grey,
highlightColor: Colors.white,
onPressed: () {
Navigator.pop(context);
print('selectedIndex:$selectedIndex' +
'data:${datas[selectedIndex]}');
},
),
],
),
Expanded(
child: CupertinoPicker(
children: datas.map((item) {
return Text(item);
}).toList(),
onSelectedItemChanged: (index) {
print('$index');
selectedIndex = index;
},
itemExtent: 36,
),
)
],
),
);
},
);
}
void _showSimpleDialog(BuildContext context) {
showDialog(
context: context,
// barrierDismissible: false,
builder: (ctx) {
return SimpleDialog(
// title: Text('SimpleDialog',textAlign: TextAlign.center,),
// titlePadding: EdgeInsets.all(10),
backgroundColor: Colors.amber,
elevation: 5,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(6),
),
),
contentPadding: EdgeInsets.all(0),
children: <Widget>[
GestureDetector(
child: Image.asset(
'assets/123.jpg',
fit: BoxFit.cover,
// height: 400,
// width: 400,
),
onTap: () {
//先关闭弹窗
Navigator.pop(context);
//跳转到下一页
Navigator.push(
context,
MaterialPageRoute(builder: (context) => TestPage()),
);
},
)
// ListTile(
// title: Center(
// child: Text("Item_1"),
// ),
// ),
// ListTile(
// title: Center(
// child: Text("Item_2"),
// ),
// ),
// ListTile(
// title: Center(
// child: Text("Item_3"),
// ),
// ),
// ListTile(
// title: Center(
// child: Text("Close"),
// ),
// onTap: () {
// Navigator.pop(context);
// },
// ),
],
);
},
);
}
void _showAlertDialog(BuildContext context) {
showDialog(
context: context,
barrierDismissible: true,
builder: (ctx) {
return AlertDialog(
title: Text(
'data',
textAlign: TextAlign.center,
),
content: Text(
'datadatadatadatadatasdadadatadatadatadatadatadatadatadatadatadatadatadata'),
elevation: 5,
actions: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
FlatButton(
child: Text('确定'),
onPressed: () {},
),
FlatButton(
child: Text('取消'),
onPressed: () {
Navigator.pop(context);
},
),
],
),
],
);
},
);
}
void _showCupertinoAlertDialog(BuildContext context) {
showDialog(
context: context,
barrierDismissible: true,
builder: (ctx) {
return CupertinoAlertDialog(
title: Text(
'data',
textAlign: TextAlign.center,
),
content: Text(
'datadatadatadatadatasdadadatadatadatadatadatadatadatadatadatadatadatadata'),
// elevation: 5,
actions: <Widget>[
// Row(
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
// children: <Widget>[
FlatButton(
child: Text('确定'),
onPressed: () {},
),
FlatButton(
child: Text('取消'),
onPressed: () {
Navigator.pop(context);
},
// ),
// ],
)
],
);
},
);
}
void _showCustomDialog(BuildContext context) {
showDialog(
context: context,
barrierDismissible: true,
builder: (ctx) {
return CustomDialog();
},
);
}
void _showSelectionDialog(BuildContext context) {
showModalBottomSheet(
context: context,
isScrollControlled: false,
builder: (ctx) {
return Container(
color: Colors.grey,
height: 130,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
// mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
GestureDetector(
child: _itemCreat(context, '相机'),
onTap: (){
print('选中相机');
},
),
GestureDetector(
child: _itemCreat(context, '相册'),
onTap: (){
print('选中相册');
},
),
GestureDetector(
child: Padding(
padding: EdgeInsets.only(top: 10),
child: _itemCreat(context, '取消'),
),
onTap: (){
Navigator.pop(context);
},
)
],
),
);
},
);
}
Widget _itemCreat(BuildContext context, String title) {
return Container(
color: Colors.white,
height: 40,
width: MediaQuery.of(context).size.width,
child: Center(
child: Text(
title,
style: TextStyle(fontSize: 16, color: Colors.black),
textAlign: TextAlign.center,
),
),
);
}
}
class CustomDialog extends Dialog {
CustomDialog({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Center(
child: Container(
color: Colors.white,
height: 365,
padding: EdgeInsets.all(10),
child: Column(
children: <Widget>[
Image.asset(
'assets/123.jpg',
fit: BoxFit.cover,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
FlatButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('确定'),
),
FlatButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('取消'),
)
],
)
],
),
),
);
}
}
flutter dialog的更多相关文章
- flutter dialog异常Another exception was thrown: No MaterialLocalizations found
flutter dialog异常Another exception was thrown: No MaterialLocalizations found import 'package:flutter ...
- 29 Flutter Dialog AlertDialog 、SimpleDialog、showModalBottomSheet、showToast
pubspec.yaml fluttertoast: ^ Dialog.dart import 'package:flutter/material.dart'; import 'package:flu ...
- flutter dialog异常Another exception was thrown: Navigator operation requested with a context that does not include a Navigator
我在使用flutter里的对话框控件的时候遇到了一个奇怪的错误 Another exception was thrown: Navigator operation requested with a c ...
- 这一次,解决Flutter Dialog的各种痛点!
前言 Q:你一生中闻过最臭的东西,是什么? A:我那早已腐烂的梦. 兄弟萌!!!我又来了! 这次,我能自信的对大家说:我终于给大家带了一个,能真正帮助大家解决诸多坑比场景的pub包! 将之前的flut ...
- flutter Dialog里ListView的问题
showDialog( context: context, builder: (ctx) { return // Dialog( // child: Container( // padding: Ed ...
- 一种更优雅的Flutter Dialog解决方案
前言 系统自带的Dialog实际上就是Push了一个新页面,这样存在很多好处,但是也存在一些很难解决的问题 必须传BuildContext loading弹窗一般都封装在网络框架中,多传个contex ...
- Flutter Dialog 屏蔽返回键
使用 WillPopScope + Future.value(false); 屏蔽返回键.代码如下: showDialog<Null>( context: context, // Buil ...
- Flutter GetX使用---简洁的魅力!
前言 使用Bloc的时候,有一个让我至今为止十分在意的问题,无法真正的跨页面交互!在反复的查阅官方文档后,使用一个全局Bloc的方式,实现了"伪"跨页面交互,详细可查看:flutt ...
- Flutter 改善套娃地狱问题(仿喜马拉雅PC页面举例)
前言 这篇文章是我一直以来很想写的一篇文章,终于下定决心动笔了. 写Flutter的小伙伴可能都感受到了:掘金的一些热门的Flutter文章下,知乎的一些Flutter的话题下或者一些论坛里面,喷Fl ...
随机推荐
- python tkinter 基本使用
这里只放表格和一个控件基本属性 grid(**options) 属性-- 下方表格详细列举了各个选项的具体含义和用法: 选项 含义column 1. 指定组件插入的列(0 表示第 1 列)2. 默认值 ...
- 基于linux与busybox的reboot命令流程分析
http://www.xuebuyuan.com/736763.html 基于Linux与Busybox的Reboot命令流程分析 ********************************** ...
- 2019.9.19HTML基础
html:超文本标记语言,不是编程语言,是标签语言,显示数据. 有双标签和单标签 双标签:有开始有结束,<body></body> 单标签:只有一个.<img src=# ...
- linux ftp 添加用户及权限管理
Linux下创建用户是很easy的事情了,只不过不经常去做这些操作,时间久了就容易忘记,顺便配置一下FTP.声明:使用Linux版本release 5.6,并以超级管理员root身份运行. 1.创建用 ...
- 并查集+优先队列+启发式合并 || 罗马游戏 || BZOJ 1455 || Luogu p2713
题面:P2713 罗马游戏 题解: 超级大水题啊,特别水.. 并查集维护每个人在哪个团里,优先队列维护每个团最低分和最低分是哪位,然后每次判断一下哪些人死了,随便写写就行 并查集在Merge时可以用启 ...
- Mongodb数据模型
描述表关系的方式: 方式一:嵌入式 > db.person.find({name:'zjf'}).pretty() { "_id" : ObjectId("592f ...
- 利用docker 部署项目
docker_tomcat_jdk 7.0 1.6 app admin && api 1.yum install docker 2.service docker start 3.创建文 ...
- 使用SQL批量插入数据到数据库 以及一些SQL函数的语法
批量插入100条记录 set nocount on declare @i int=1; while @i<=100 begin Insert into Client(id,ClientCode, ...
- 【leetcode】1244. Design A Leaderboard
题目如下: Design a Leaderboard class, which has 3 functions: addScore(playerId, score): Update the leade ...
- poj 3579 Median 二分套二分 或 二分加尺取
Median Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 5118 Accepted: 1641 Descriptio ...