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

原创

已于 2024-08-30 17:06:52 修改 · 1.2k 阅读

8 ·

CC 4.0 BY-SA版权

文章标签：

#flutter #java #前端

于 2024-01-20 17:32:09 首次发布

文章介绍了如何在Flutter中使用自定义的MyDialog组件，展示了如何创建一个带有标题、内容和两个按钮（取消和确认）的对话框，并提供了在页面上使用的示例代码。

示例完成结果展示：

示例组件代码：

context：上下文

title：提示标题，null时不显示

content：提示内容，null时不显示

cancelText：取消按钮文字，null时不显示取消按钮

confirmText：确认按钮文字

//lib\widgets\my.dart
import 'package:flutter/material.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