Flutter平台通用弹窗插件flutter_platform_alertbox的使用

Flutter平台通用弹窗插件flutter_platform_alertbox的使用

特性

• 信息提示弹窗
• 确认提示弹窗
• 删除项提示弹窗

支持的平台

• Flutter Android
• Flutter iOS
• Flutter Web
• Flutter 桌面端

安装

在你的 pubspec.yaml 文件中添加以下依赖：

dependencies:
  flutter_platform_alertbox: <最新版本>

然后导入该库：

import 'package:flutter_platform_alertbox/flutter_platform_alertbox.dart';

如何使用

信息提示弹窗

FlutterPlatFormAlertBox().informationDialogBox(
  context: context,
  title: "提示标题",
  body: "这是提示内容",
  heading: "这是提示头部",
);

确认提示弹窗

FlutterPlatFormAlertBox().confirmationDialogBox(
  context: context,
  title: "确认标题",
  content: "这是确认内容",
  cancelText: "取消",
  submitText: "提交",
  isCancelable: true,
  onSubmit: () {
    debugPrint("提交点击");
  },
);

删除项提示弹窗

FlutterPlatFormAlertBox().deleteItemDialogBox(
  context: context,
  title: "你确定要删除此项目吗？",
  cancelText: "取消",
  submitText: "删除",
  isCancelable: true,
  onSubmit: () {
    debugPrint("提交点击");
  },
);

示例代码

以下是一个完整的示例代码，展示了如何在应用中使用上述三种弹窗。

import 'package:flutter/material.dart';
import 'package:flutter_platform_alertbox/flutter_platform_alertbox.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: AlertBoxExample(),
    );
  }
}

class AlertBoxExample extends StatefulWidget {
  const AlertBoxExample({Key? key}) : super(key: key);

  [@override](/user/override)
  State<AlertBoxExample> createState() => _AlertBoxExampleState();
}

class _AlertBoxExampleState extends State<AlertBoxExample> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("弹窗示例")),
      body: SizedBox(
        width: MediaQuery.of(context).size.width,
        height: MediaQuery.of(context).size.height,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            TextButton(
                onPressed: () {
                  FlutterPlatFormAlertBox().informationDialogBox(
                      context: context,
                      title: "提示标题",
                      body: "这是提示内容",
                      heading: "这是提示头部");
                },
                child: Container(
                  color: Colors.yellow,
                  padding: const EdgeInsets.all(8),
                  child: const Text("信息提示弹窗"),
                )),
            SizedBox(
              height: 10,
            ),
            TextButton(
                onPressed: () {
                  FlutterPlatFormAlertBox().confirmationDialogBox(
                      context: context,
                      title: "确认标题",
                      content: "这是确认内容",
                      cancelText: "取消",
                      submitText: "提交",
                      isCancelable: true,
                      onSubmit: () {
                        debugPrint("提交点击");
                      });
                },
                child: Container(
                  color: Colors.yellow,
                  padding: const EdgeInsets.all(8),
                  child: const Text("确认提示弹窗"),
                )),
            SizedBox(
              height: 10,
            ),
            TextButton(
                onPressed: () {
                  FlutterPlatFormAlertBox().deleteItemDialogBox(
                      context: context,
                      title: "你确定要删除此项目吗？",
                      cancelText: "取消",
                      submitText: "删除",
                      isCancelable: true,
                      onSubmit: () {
                        debugPrint("提交点击");
                      });
                },
                child: Container(
                  color: Colors.yellow,
                  padding: const EdgeInsets.all(8),
                  child: const Text("删除项提示弹窗"),
                )),
          ],
        ),
      ),
    );
  }
}