AlertDialog 、SimpleDialog、 showModalBottomSheet、showToast 自定义 Dialog
// AlertDialog 、SimpleDialog、showModalBottomSheet、showToast
// 使用showToast安装插件 https://pub.dev/packages/fluttertoast
Fluttertoast.showToast( msg: "This is Short Toast", toastLength: Toast.LENGTH_SHORT, timeInSecForIos: 1); // 改变弹窗内的值
StatefulBuilder(
builder: (context, changeState) {
return '内容'
},
)
// 点击背景消失
showDialog(
context: context,
builder: (context) {
return CupertinoDialog (
child: Text('zxcvbnm123456', style: TextStyle(fontSize: Screen.width(30), decoration: TextDecoration.none, color: Colors.black, fontWeight: FontWeight.normal)));
}
);
// 点击背景不消失
showCupertinoDialog(
context: context,
builder: (context) {
return CupertinoDialog (
child: Text('zxcvbnm123456', style: TextStyle(fontSize: Screen.width(30), decoration: TextDecoration.none, color: Colors.black, fontWeight: FontWeight.normal)));
}
);
import 'package:flutter/material.dart';
import 'myDialog.dart'; class DialogPage extends StatefulWidget{
DialogPage({Key key});
_Dialog createState() => _Dialog();
} class _Dialog extends State {
@override
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar: AppBar(
title: Text('Dialog')
),
body: ListView(
children: <Widget>[
RaisedButton(
child: Text('AlertDialog'),
onPressed: () {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text('提示'),
content: Text('确定要取消吗'),
actions: <Widget>[
FlatButton(child: Text('取消'), onPressed: () {Navigator.pop(context, '222');},),
FlatButton(child: Text('确定'), onPressed: () {Navigator.pop(context, '222');},),
],
);
}
);
},
),
RaisedButton(
child: Text('弹出选择卡'),
onPressed: () {
showDialog(
context: context,
builder: (context) {
return SimpleDialog(
title: Text('选择卡'),
children: <Widget>[
SimpleDialogOption(child: Text('A'), onPressed: () { Navigator.pop(context);},),
SimpleDialogOption(child: Text('B'), onPressed: () { Navigator.pop(context);},),
SimpleDialogOption(child: Text('C'), onPressed: () { Navigator.pop(context);},),
],
);
}
);
},
),
RaisedButton(
child: Text('弹出自定义'),
onPressed: () {
showDialog(
context: context,
builder: (context) {
return MyDialog(title:"关于我们", content:"关于我们");
}
);
},
)
],
)
);
}
}
// 自定义dialog
import 'dart:async'; import 'package:flutter/material.dart';
//MyDialog(title:"关于我们", content:"关于我们"); 引入文件 然后调用方法 class MyDialog extends Dialog {
String title;
String content; MyDialog({this.title="",this.content=""}); _showTimer(context){
var timer;
timer = Timer.periodic(
Duration(milliseconds: 3000), (t) { print('关闭');
Navigator.pop(context);
t.cancel(); //取消定时器 timer.cancel();
});
} @override
Widget build(BuildContext context) { _showTimer(context); // TODO: implement build
return Material(
type: MaterialType.transparency,
child: Center(
child: Container(
height: 300,
width: 300,
color: Colors.white,
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.all(10),
child: Stack(
children: <Widget>[
Align(
alignment: Alignment.center,
child: Text("${this.title}"),
),
Align(
alignment: Alignment.centerRight,
child: InkWell(
child: Icon(Icons.close),
onTap: (){
Navigator.pop(context);
},
),
)
],
),
),
Divider(),
Container(
padding: EdgeInsets.all(10),
width: double.infinity,
child: Text("${this.content}",textAlign: TextAlign.left),
)
],
), )),
);
}
}
AlertDialog 、SimpleDialog、 showModalBottomSheet、showToast 自定义 Dialog的更多相关文章
- 30 Flutter自定义Dialog
MyDialog.dart import 'dart:async'; import 'package:flutter/material.dart'; class MyDialog extends Di ...
- android 自定义Dialog背景透明及显示位置设置
先贴一下显示效果图,仅作参考: 代码如下: 1.自定义Dialog public class SelectDialog extends AlertDialog{ public SelectDialog ...
- Android 开发之自定义Dialog及UI的实现
我们在开发中,经常会自定义Dialog,因为原生的AlertDialog无法满足我们的需求,这个时候就需要自定义Dialog,那么如何自定义呢,其实不难,就是有点繁琐而已.也就是自定义一个UI的xml ...
- 非自定义和自定义Dialog的介绍!!!
一.非自定义Dialog的几种形式介绍 转自:http://www.kwstu.com/ArticleView/kwstu_20139682354515 前言 对话框对于应用也是必不可少的一个组件,在 ...
- 自定义dialog自动弹出软键盘
1.解决无法弹出输入法: 在show()方法调用之前,用dialog.setView(new EditText(context))添加一个空的EditText,由于是自定义的AlertDialog,有 ...
- Android自定义 Dialog 对话框
Android自定义Dialoghttp://www.cnblogs.com/and_he/archive/2011/09/16/2178716.html Android使用自定义AlertDialo ...
- 自定义Dialog布局的弹窗功能的简单实现
package com.loaderman.dialogdemo; import android.os.Bundle; import android.support.v7.app.AlertDialo ...
- android 自定义Dialog去除黑色边框
在自定义Dialog时显示的界面中老是有黑色的边框,下面就介绍使用style去除黑色边框方法. 首先在values/styles定义自定义样式: <style name="MyDial ...
- Android—自定义Dialog
在 Android 日常的开发中,Dialog 使用是比较广泛的.无论是提示一个提示语,还是确认信息,还是有一定交互的(弹出验证码,输入账号密码登录等等)对话框. 而我们去看一下原生的对话框,虽然随着 ...
随机推荐
- pycharm运行RF脚本时的环境搭建与配置
1.安装pycharm:2.file->setting,下载插件intellibot,重启pycharm:3.配置识别RF类型文件,filefile->editor->file ty ...
- JavaWeb学习(三) : 如何在 Eclipse 中创建一个Web 项目并成功运行?
前置条件 : 1.确保已安装 Eclipse.Tomcat 服务器安装包 2.jdk.环境变量都已配置成功. 3.注意在安装 Eclipse 时一定要选择第二个有 Web 项目的进行安装, 不然安装成 ...
- 动态生成sku组合输入列表
<!DOCTYPE html> <html> <head> <title></title> <meta http-equiv=&quo ...
- 微信小程序中的左右联动
微信小程序端的左右联动-滚动效果插件: 效果图如下: ...
- Qt中实现点击一个label,跳转到打开一个浏览器链接
配置模块 首先需要在.pro配置文件中添加QT += network 重写自定义Label .h文件 class MyClickLabel : public QLabel { Q_OBJECT pub ...
- 使用Echarts实现折线图的一点总结
使用Echarts的一点总结 1.安装,我使用得vue cnpm install echarts --save 2.在入口文件main.js中注册,并使用 // 引入折线图 echarts impor ...
- 洛谷P1028 数的计算
https://www.luogu.org/problem/P1028 #include<cstdio> using namespace std; int main(){ ,i,f[]; ...
- pl/sql developer试用期结束
(产品代码)Product Code:ljkfuhjpccxt8xq2re37n97595ldmv9kch (序列号)Serial Number:302967 (口令)Password:xs374ca ...
- 自己动手系列----使用数组实现一个简单的Set
Set:注重独一无二的性质,该体系集合可以知道某物是否已近存在于集合中,不会存储重复的元素用于存储无序(存入和取出的顺序不一定相同)元素,值不能重复.主要有HashSet和TreeSet两大实现类. ...
- FPM 0.08不能运行破解办法……
FPM_0.080.rar 破解办法:用UltraEdit打开FPM.exe,查找"33 C0 E9 F2"(注意中间有空格)将33改为8B,F2改为00