Flutter对话框示例插件alert_dialog_example_s的使用

Flutter对话框示例插件alert_dialog_example_s的使用

示例

这是一个使用该插件的简单示例。 <=sample=>

描述

这是一个简单的带可定制选项的警告对话框。

安装

如果你想在你的Flutter项目中使用这个插件，请按照以下步骤操作：

  1. 在你的pubspec.yaml文件中添加以下依赖项：
dependencies:
  alert_dialog_example_s: ^0.0.2

  1. 运行flutter pub get来安装插件。

  2. 在你想使用它的地方导入插件：

import 'package:alert_dialog_example_s/alert_dialog_example_s.dart';

示例代码

这是完整的示例代码，展示了如何使用该插件。

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

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

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

  // 这个小部件是你的应用的根组件。
  [@override](/user/override)
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyHomePage(),
    );
  }
}

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

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

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text('Alert Dialog Example'),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(10.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              const Text('点击按钮以显示警告对话框'),
              const SizedBox(height: 10),
              CircleAvatar(
                radius: 30,
                child: IconButton(onPressed: () async {
                  // 使用CustomAlertBoxS.showCustomAlertBox方法显示自定义警告对话框
                  await CustomAlertBoxS.showCustomAlertBox(
                    context: context,
                    willDisplayWidget: const Text('我的自定义警告对话框'),
                  );
                }, icon: const Icon(Icons.error)),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

更多关于Flutter对话框示例插件alert_dialog_example_s的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter对话框示例插件alert_dialog_example_s的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在 Flutter 中，AlertDialog 是一个常用的组件，用于显示弹窗提示用户。虽然 alert_dialog_example_s 并不是 Flutter 官方提供的插件，但我们可以通过一个简单的示例来展示如何使用 AlertDialog。

以下是一个基本的 AlertDialog 使用示例：

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('AlertDialog Example'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              _showAlertDialog(context);
            },
            child: Text('Show Alert Dialog'),
          ),
        ),
      ),
    );
  }

  void _showAlertDialog(BuildContext context) {
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text('Alert'),
          content: Text('This is a simple alert dialog.'),
          actions: <Widget>[
            TextButton(
              child: Text('OK'),
              onPressed: () {
                Navigator.of(context).pop();
              },
            ),
          ],
        );
      },
    );
  }
}
回到顶部