Flutter消息提示插件vido_toast的使用

Flutter消息提示插件vido_toast的使用

安装 💻

要开始使用vido_toast，您必须在您的机器上安装Flutter SDK。

在pubspec.yaml文件中添加vido_toast依赖项：

dependencies:
  vido_toast:

然后运行以下命令来安装它：

flutter packages get

持续集成 🤖

vido_toast自带了一个由Very Good Workflows支持的GitHub Actions工作流。但是，您可以根据需要添加自己的CI/CD解决方案。

默认情况下，每次拉取请求和推送时，CI都会格式化、静态检查和测试代码。这确保了代码的一致性和正确性。项目使用Very Good Analysis来进行严格的分析选项。覆盖率通过Very Good Workflows进行强制执行。

运行测试 🧪

对于首次使用的用户，安装very_good_cli：

dart pub global activate very_good_cli

运行所有单元测试：

very_good test --coverage

查看生成的覆盖率报告可以使用lcov：

# 生成覆盖率报告
genhtml coverage/lcov.info -o coverage/

# 打开覆盖率报告
open coverage/index.html

使用示例

以下是一个简单的示例，演示如何在Flutter应用中使用vido_toast插件。

示例代码

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:vido_toast/vido_toast.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      themeMode: ThemeMode.system,
      theme: ThemeData.light().copyWith(
        shadowColor: ThemeData.light().shadowColor.withOpacity(0.1),
      ),
      darkTheme: ThemeData.dark(),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
      builder: (context, child) {
        if (child == null) return const Scaffold();
        return Toast.init(context, child);
      },
    );
  }
}

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

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      Toast.success('Toast show success!');
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            InkWell(
              onTap: () {
                Toast.center('Toast Center!');
              },
              child: const ToastCenterWidget(
                icon: Icon(
                  CupertinoIcons.checkmark_circle,
                  color: Color(0xff2cae88),
                  size: 32,
                ),
                child: Text(
                  'Toast Center!',
                  textAlign: TextAlign.center,
                ),
              ),
            ),
            const ToastWidget(
              icon: Icon(
                CupertinoIcons.info_circle,
                color: Color(0xff407DE8),
              ),
              child: Text(
                'Toast show!',
                textAlign: TextAlign.center,
              ),
            ),
            const ToastWidget(
              icon: Icon(
                CupertinoIcons.checkmark_circle,
                color: Color(0xff2cae88),
              ),
              child: Text(
                'Toast show success!',
                textAlign: TextAlign.center,
              ),
            ),
            const ToastWidget(
              icon: Icon(
                CupertinoIcons.exclamationmark_circle,
                color: Colors.red,
              ),
              child: Text(
                'Toast show error!',
                textAlign: TextAlign.center,
              ),
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}

说明

1. 导入库：

   import 'package:vido_toast/vido_toast.dart';
   

2. 初始化： 在MaterialApp的builder中调用Toast.init以初始化Toast插件。

   builder: (context, child) {
     if (child == null) return const Scaffold();
     return Toast.init(context, child);
   },
   

3. 显示不同的Toast：

   • 成功消息：

     Toast.success('Toast show success!');
     

   • 中心对齐的消息：

     Toast.center('Toast Center!');
     

   • 其他类型的消息：

     ToastWidget(
       icon: Icon(
         CupertinoIcons.info_circle,
         color: Color(0xff407DE8),
       ),
       child: Text(
         'Toast show!',
         textAlign: TextAlign.center,
       ),
     )