【flutter】完全自定义样式模态对话框

news2024/11/27 8:32:31

 示例完成结果展示:

 

示例组件代码:

context:上下文

title:提示标题,null时不显示

content:提示内容,null时不显示

cancelText:取消按钮文字,null时不显示取消按钮

confirmText:确认按钮文字

//lib\widgets\my.dart
class My {
static Future<bool> dialog(
    BuildContext context, {
    String? title = "提示",
    String? content,
    String? cancelText = "Cancel",
    String confirmText = "Confirm",
  }) async {
    final bool? isConfirm = await showDialog<bool>(
      context: context,
      //点击背景灰色区域是否关闭对话框
      barrierDismissble: false,
      builder: (BuildContext context) => Dialog(
        //这部分是对话框样式,可以完全自定义
        child: Container(
          width: 560.w,
          padding: EdgeInsets.only(top: 40.w),
          clipBehavior: Clip.hardEdge,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(16.w),
          ),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              if (title != null)
                Padding(
                  padding: EdgeInsets.
      ),only(bottom: 34.w, left: 30.w, right: 30.w),
                  child: Text(
                    title,
                    style: TextStyle(
                      color: const Color(0xFF353A37),
                      fontSize: 36.w,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ),
              if (content != null)
                Padding(
                  padding: EdgeInsets.only(bottom: 40.w, left: 30.w, 
                  child: Text(
                    content,
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      color: const Color(0xFF858786),
                      fontSize: 28.w,
                    ),
                  ),
                ),
              Row(
                children: [
                  if (cancelText != null)
                    Expanded(
                      child: GestureDetector(
                        //点击取消按钮
                        onTap: () {
                          Navigator.pop(context, false);
                        },
                        child: Container(
                          height: 100.w,
                          decoration: const BoxDecoration(
                            border: Border(
                              top: BorderSide(color: Color(0xFFE5E5E5)),
                              right: BorderSide(
                                color: Color(0xFFE5E5E5),
                              ),
                            ),
                          ),
                          child: Center(
                            child: Text(
                              cancelText,
                              style: TextStyle(
                                fontSize: 36.w,
                                color: const Color(0xFF858786),
                                fontWeight: FontWeight.w700,
                              ),
                            ),
                          ),
                        ),
                      ),
                    ),
                  Expanded(
                    child: GestureDetector(
                      //点击确认按钮
                      onTap: () {
                        Navigator.pop(context, true);
                      },
                      child: Container(
                        height: 100.w,
                        decoration: const BoxDecoration(
                          border: Border(
                            top: BorderSide(color: Color(0xFFE5E5E5)),
                          ),
                        ),
                        child: Center(
                          child: Text(
                            confirmText,
                            style: TextStyle(
                              fontSize: 36.w,
                              color: const Color(0xFF40B169),
                              fontWeight: FontWeight.w700,
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
      ),
    );
    //返回结果
    return isConfirm ?? false;
  }
}

页面上使用:

//导入包
import 'package:app_hongxin/widgets/my.dart';

......

onTap()async{
    if(await My.dialog(
      context,
      title: "提示",
      content: "提示内容提示内容提示内容提示内容提示内容提示内容提示内容提示内容提示内容提示内容",
    )){
      print("点击确认");
    }else{
      print("点击取消");
    }
  }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1399634.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Canny边缘检测 双阈值检测理解

问题引入 我们用一个实际例子来引入问题 import cv2 import numpy as npimgcv2.imread("test.png",cv2.IMREAD_GRAYSCALE) # 修改图像大小 show cv2.resize(img,(500,500))v1cv2.Canny(show,120,250) v2cv2.Canny(show,50,100)# 连接图像 res np.hstack((v1,v2)…

MSPM0L1306例程学习-UART部分(2)

MSPM0L1306例程学习系列 1.背景介绍 写在前边的话&#xff1a; 这个系列比较简单&#xff0c;主要是围绕TI官网给出的SDK例程进行讲解和注释。并没有针对模块的具体使用方法进行描述。所有的例程均来自MSPM0 SDK的安装包&#xff0c;具体可到官网下载并安装: https://www.ti…

java枚举详细解释

枚举的基本认识 我们一般直接定义一个单独的枚举类 public enum 枚举类名{枚举项1,枚举项2,枚举项3 } 可以通过 枚举类名.枚举项 来访问该枚举项的 - 可以理解为 枚举项就是我们自己定义的一个数据类型,是独一无二的 接下来我们直接用一个例子来完全理解 加深理解 这里…

[C#]winform部署openvino官方提供的人脸检测模型

【官方框架地址】 https://github.com/sdcb/OpenVINO.NET 【框架介绍】 OpenVINO&#xff08;Open Visual Inference & Neural Network Optimization&#xff09;是一个由Intel推出的&#xff0c;针对计算机视觉和机器学习任务的开源工具套件。通过优化神经网络&#xff…

vtk qt切割stl模型

一直想实现对stl模型的某个方向进行平面切割 通过滑动slider然后对模型进行某一个方向的面切割。同时可以用鼠标对模型进行移动缩放&#xff0c;旋转等操作。然后可以加一些颜色点云显示等操作。 stl加载&#xff1a; QString selectFilePath QFileDialog::getOpenFileName…

孚盟云 多处SQL注入漏洞复现

0x01 产品简介 上海孚盟软件有限公司是一家外贸SaaS服务提供商,也是专业的外贸行业解决方案专业提供商。 全新的孚盟云产品,让用户可以用云模式实现信息化管理,让用户的异地办公更加流畅,大大降低中小企业在信息化上成本,用最小的投入享受大型企业级别的信息化服务,使中…

六、标准对话框、多应用窗体

一、标准对话框 Qt提供了一些常用的标准对话框&#xff0c;如打开文件对话框、选择颜色对话框、信息提示和确认选择对话框、标准输入对话框等。1、预定义标准对话框 &#xff08;1&#xff09;QFileDialog 文件对话框 QString getOpenFileName() 打开一个文件QstringList ge…

《JVM由浅入深学习九】 2024-01-15》JVM由简入深学习提升分(生产项目内存飙升分析)

目录 开头语内存飙升问题分析与案例问题背景&#xff1a;我华为云的一个服务器运行我的一个项目“csdn-automatic-triplet-0.0.1-SNAPSHOT.jar”&#xff0c;由于只是用来测试的服务器&#xff0c;只有2G&#xff0c;所以分配给堆的内存1024M查询内存使用&#xff08;top指令&a…

Self-RAG:通过自我反思学习检索、生成和批判

论文地址&#xff1a;https://arxiv.org/abs/2310.11511 项目主页&#xff1a;https://selfrag.github.io/ Self-RAG学习检索、生成和批评&#xff0c;以提高 LM 的输出质量和真实性&#xff0c;在六项任务上优于 ChatGPT 和检索增强的 LLama2 Chat。 问题&#xff1a;万能L…

活性白土数据研究:预计2029年将达到9.2亿美元

活性白土是用粘土(主要是膨润土)为原料&#xff0c;经无机酸化或盐或其他方法处理&#xff0c;再经水漂洗、干燥制成的吸附剂&#xff0c;外观为乳白色粉末&#xff0c;无臭&#xff0c;无味&#xff0c;无毒&#xff0c;吸附性能很强&#xff0c;能吸附有色物质、有机物质。广…

一键完成,批量转换HTML为PDF格式的方法,提升办公效率

在当今数字化的时代&#xff0c;HTML和PDF已经成为两种最常用的文件格式。HTML用于网页内容的展示&#xff0c;而PDF则以其高度的可读性和不依赖于平台的特性&#xff0c;成为文档分享和传播的首选格式。然而&#xff0c;在办公环境中&#xff0c;我们经常需要在这两种格式之间…

CSS注释

CSS注释 哇&#xff0c;最近我发现CSS里面的注释真是个好东西呢&#xff01;虽然它们不会在网页上显示出来&#xff0c;但是对于我这样的新手来说&#xff0c;真的很有助于理解代码是怎么工作的。 CSS注释的小秘密 你知道吗&#xff0c;CSS里的注释就像是小纸条&#xff0c;…

Leetcoder Day10|栈与队列part02(栈的应用)

语言&#xff1a;Java/C 目录 20. 有效的括号 1047. 删除字符串中的所有相邻重复项 150. 逆波兰表达式求值 今日总结 20. 有效的括号 给定一个只包括 (&#xff0c;)&#xff0c;{&#xff0c;}&#xff0c;[&#xff0c;] 的字符串&#xff0c;判断字符串是否有效。 有效字…

Android双击图片放大移动图中双击点到ImageView区域中心,Kotlin

Android双击图片放大移动图中双击点到ImageView区域中心&#xff0c;Kotlin 初始化状态&#xff0c;ImageView里面只是显示一张fitcenter被缩放的原图&#xff0c;当手指在图片上双击后&#xff08;记录双击点位置&#xff1a;mCurX&#xff0c;mCurY&#xff09;画一个红色小圆…

TensorRT模型优化部署 (八)--模型剪枝Pruning

系列文章目录 第一章 TensorRT优化部署&#xff08;一&#xff09;–TensorRT和ONNX基础 第二章 TensorRT优化部署&#xff08;二&#xff09;–剖析ONNX架构 第三章 TensorRT优化部署&#xff08;三&#xff09;–ONNX注册算子 第四章 TensorRT模型优化部署&#xff08;四&am…

AxiosError: Request failed with status code 503

spring.application.name属性指定了应用程序的名称为ssm_serviceA。这个属性用于标识应用程序&#xff0c;可以在日志、监控和其他相关功能中使用。通常情况下&#xff0c;应用程序的名称是用来区分不同的应用程序或服务的。 通过配置spring.application.name&#xff0c;你可以…

LSTM学习笔记

上一篇文章中我们提到&#xff0c;CRNN模型中用于预测特征序列上下文的模块为双向LSTM模块&#xff0c;本篇中就来针对该模块的结构和实现做一些理解。 Bidirectional LSTM模块结构如下图所示&#xff1a; 在Pytorch中&#xff0c;已经集成了LSTM模块&#xff0c;定义如下&…

Sqoop故障排除指南:处理错误和问题

故障排除是每位数据工程师和分析师在使用Sqoop进行数据传输时都可能遇到的关键任务。Sqoop是一个功能强大的工具&#xff0c;但在实际使用中可能会出现各种错误和问题。本文将提供一个详尽的Sqoop故障排除指南&#xff0c;涵盖常见错误、问题和解决方法&#xff0c;并提供丰富的…

认识并使用Shiro技术

认识并使用Shiro 一、对Shiro的基本认知1、Shiro是什么&#xff1f;2、Shiro的核心组件是&#xff1f;2.1 Subject2.2 UsernamePasswordToken2.3 Realm&#xff08;重点是&#xff1a;AuthorizingRealm用于授权、AuthenticatingRealm用于认证&#xff09;2.4 SecurityManager2.…

NLP论文阅读记录 - 2021 | WOS 基于多头自注意力机制和指针网络的文本摘要

文章目录 前言0、论文摘要一、Introduction1.1目标问题1.2相关的尝试1.3本文贡献 二.问题定义和解决问题的假设问题定义解决问题的假设 三.本文方法3.1 总结为两阶段学习3.1.1 基础系统 3.2 重构文本摘要 四 实验效果4.1数据集4.2 对比模型4.3实施细节4.4评估指标4.5 实验结果4…