Flutter弹窗提示插件the_flutter_alert的使用

Flutter弹窗提示插件the_flutter_alert的使用

本README描述了该插件的用法。如果您将此插件发布到pub.dev，则此README的内容将出现在您的插件页面上。

使用

首先，在您的项目中添加以下导入语句：

import 'package:the_flutter_alert/the_flutter_alert.dart';

然后，您可以使用showFlutterAlertNotification函数来显示弹窗提示。以下是一个简单的示例：

FlutterAlert.showFlutterAlertNotification(
  context,
  'Hello World',
  type: FlutterAlertType.info,
);

完整示例

下面是一个完整的示例，展示了如何在应用中使用the_flutter_alert插件。

示例代码

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // 此小部件是您的应用的根。
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  // 显示通知的方法
  _showNotification(String content,
      {FlutterAlertType type = FlutterAlertType.info}) {
    FlutterAlert.showFlutterAlertNotification(
      context,
      content,
      type: type,
    );
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // 显示信息弹窗
            ElevatedButton(
                onPressed: () {
                  _showNotification('Showing info alert');
                },
                child: const Text('显示信息弹窗')),

            // 显示成功弹窗
            ElevatedButton(
                onPressed: () {
                  _showNotification('Showing success alert',
                      type: FlutterAlertType.success);
                },
                child: const Text('显示成功弹窗')),

            // 显示错误弹窗
            ElevatedButton(
                onPressed: () {
                  _showNotification('Showing error alert',
                      type: FlutterAlertType.error);
                },
                child: const Text('显示错误弹窗')),

            // 显示警告弹窗
            ElevatedButton(
                onPressed: () {
                  _showNotification('Showing warning alert',
                      type: FlutterAlertType.warning);
                },
                child: const Text('显示警告弹窗')),
          ],
        ),
      ),
    );
  }
}