首页 > 其他分享 >27、flutter Dialog 弹窗

27、flutter Dialog 弹窗

时间:2023-12-25 17:14:18浏览次数:47  
标签:27 const Text pop context print Navigator flutter 弹窗

AlertDialog

  //放在State<>之下
void _alertDialog() async {
    var result = await showDialog(
        barrierDismissible: true, //表示点击灰色背景的时候是否消失弹出框
        context: context,
        builder: (context) {
          return AlertDialog(
            title: const Text("提示信息!"),
            content: const Text("您确定要删除吗?"),
            actions: <Widget>[
              //按钮组
              TextButton(
                child: const Text("取消"),
                onPressed: () {
                  print("取消————————————————————");
                  Navigator.pop(context, 'Cancle'); //关闭页面并传值
                },
              ),
              TextButton(
                child: const Text("确定"),
                onPressed: () {
                  print("确定————————————————");
                  Navigator.pop(context, "Ok");
                },
              )
            ],
          );
        });
    print(result);
  }

 

SimpleDialog、SimpleDialogOption

  void _simpleDialog() async {
    var result = await showDialog(
        barrierDismissible: true, //表示点击灰色背景的时候是否消失弹出框
        context: context,
        builder: (context) {
          return SimpleDialog(
            title: const Text("请选择内容"),
            children: <Widget>[
              SimpleDialogOption(
                child: const Text("Option A"),
                onPressed: () {
                  print("Option A");
                  Navigator.pop(context, "A");
                },
              ),
              const Divider(),
              SimpleDialogOption(
                child: const Text("Option B"),
                onPressed: () {
                  print("Option B");
                  Navigator.pop(context, "B");
                },
              ),
              const Divider(),
              SimpleDialogOption(
                child: const Text("Option C"),
                onPressed: () {
                  print("Option C");
                  Navigator.pop(context, "C");
                },
              ),
            ],
          );
        });
    print(result);
  }

showModalBottomSheet

  void _modelBottomSheet() async {
    var result = await showModalBottomSheet(
        context: context,
        builder: (context) {
          return SizedBox(
            height: 220,
            child: Column(
              children: <Widget>[
                ListTile(
                  title: const Text("分享 A"),
                  onTap: () {
                    Navigator.pop(context, "分享 A");
                  },
                ),
                const Divider(),
                ListTile(
                  title: const Text("分享 B"),
                  onTap: () {
                    Navigator.pop(context, "分享 B");
                  },
                ),
                const Divider(),
                ListTile(
                  title: const Text("分享 C"),
                  onTap: () {
                    Navigator.pop(context, "分享 C");
                  },
                )
              ],
            ),
          );
        });
    print(result);
  }

使用

ElevatedButton(onPressed: _alertDialog, child: Text("AlertDialog")),

Flutter Toast(几秒后消失)

fluttertoast: ^8.0.9
import 'package:fluttertoast/fluttertoast.dart';
  void _toTost() async{
    Fluttertoast.showToast(
        msg: "提示信息",
        toastLength: Toast.LENGTH_SHORT,  //安卓里调时间   LENGTH_LONG 长时间  LENGTH_SHORT 短时间
        gravity: ToastGravity.CENTER, //位置
        timeInSecForIosWeb: 1, //提示时间 针对 ios与web
        backgroundColor: Color.fromARGB(255, 4, 151, 77), //背景颜色
        textColor: const Color.fromARGB(255, 187, 38, 38), //字体颜色
        fontSize: 16.0); //字体大小
  }

 

 

 

标签:27,const,Text,pop,context,print,Navigator,flutter,弹窗
From: https://www.cnblogs.com/xbinbin/p/17926363.html

相关文章

  • flutter响应式
    1LayoutBuilder作用比较类似css的@media,根据不同的尺寸渲染不同的节点LayoutBuilder( builder:(BuildContextcontext,constraints){print(constraints);//BoxConstraints(0.0<=w<=360.0,0.0<=h<=692.0) print(constraints.maxHeight);print(constraints.......
  • Flutter Icons交错动画
    import'package:flutter/material.dart';classAnimateIconsextendsStatelessWidget{constAnimateIcons({super.key});@overrideWidgetbuild(BuildContextcontext){returnScaffold(appBar:AppBar(title:constText(�......
  • 26、Flutter中命名路由
    Flutter中的命名路由main.dart中配置路由voidmain(){runApp(MaterialApp(theme:ThemeData(appBarTheme:constAppBarTheme(color:Colors.blue,//设置导航栏颜色(新版本的设置方法)),),//home:Scaffold(body:MyFlutter1())......
  • 25、Flutter中基本路由
    Flutter路由介绍Flutter中的路由通俗的讲就是页面跳转。在Flutter中通过Navigator组件管理路由导航。并提供了管理堆栈的方法。如:Navigator.push和Navigator.popFlutter中给我们提供了两种配置路由跳转的方式:1、基本路由2、命名路由Flutter中的基本路由使用想从HomePage......
  • flutter中背景图片(动态图片)
    单页面设置背景图片使用 Container 组件和 decoration 属性:优点:简单易用,适用于大多数情况下的页面背景设置。缺点:无法控制背景图片的位置和层级。classMyBookextendsStatelessWidget{constMyBook({super.key});@overrideWidgetbuild(BuildContextcontex......
  • day27(面向对象)
    1.人狗大战"""推导步骤1:代码定义出人和狗"""#person1={#'name':'jason',#'age':18,#'gender':'male',#'p_type':'猛男',#'attack_val'......
  • Flutter中 关于package:flutter/cupertino.dart和package:flutter/material.dart的区
    import'package:flutter/cupertino.dart';和import'package:flutter/material.dart';这两个语句分别用于导入Flutter框架中的不同部分,而且它们通常用于创建不同风格的用户界面。1.import'package:flutter/material.dart';:这是导入Material部分的语句,Material是一种设计......
  • flutter 桌面通知 气泡消息数量
    先上效果原理Android操作系统提供的NotificationManager接口来设置应用程序图标上的徽章iOS操作系统提供的UIApplication.shared.applicationIconBadgeNumber使用flutterflutterpubaddflutter_app_badger通过在启动退出时候更新气泡import'package......
  • Jedis串读(转发https://heapdump.cn/article/5092763解Bug之路-串包Bug)
    解Bug之路-串包Bug笔者很热衷于解决Bug,同时比较擅长(网络/协议)部分,所以经常被唤去解决一些网络IO方面的Bug。现在就挑一个案例出来,写出分析思路,以飨读者,希望读者在以后的工作中能够少踩点坑。串包Bug现场前置故障Redis超时由于某个系统大量的hget、hset操作将Redis拖垮,通过......
  • 2023-2024-1 20231427 《计算机基础与程序设计》第十三周学习总结
    学期(如2023-2024-1)学号(如:20231300)《计算机基础与程序设计》第X周学习总结作业信息这个作业属于哪个课程https://edu.cnblogs.com/campus/besti/2023-2024-1-CFAP/()这个作业要求在哪里https://www.cnblogs.com/rocedu/p/9577842.html#WEEK13()这个作业的目标<加入......