flutter如何实现toast弹窗

在Flutter中如何实现Toast弹窗功能？官方好像没有提供直接的Toast组件，目前看到有些第三方库可以实现，但不确定哪个更稳定可靠。想请教大家常用的实现方式是什么？是否有推荐的最佳实践或需要注意的兼容性问题？

2 回复

Flutter中实现Toast弹窗可以使用第三方库fluttertoast。步骤如下：

  1. 在pubspec.yaml中添加依赖：

    dependencies:
  fluttertoast: ^8.2.4

  2. 运行flutter pub get安装依赖。

  3. 在代码中导入并使用：

    import 'package:fluttertoast/fluttertoast.dart';

Fluttertoast.showToast(
  msg: "这是一个Toast",
  toastLength: Toast.LENGTH_SHORT,
  gravity: ToastGravity.BOTTOM,
);

简单快捷，支持自定义样式和位置。

更多关于flutter如何实现toast弹窗的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在 Flutter 中，实现 Toast 弹窗有多种方式，以下是两种常用方法：

方法一：使用 fluttertoast 库（推荐）

  1. 添加依赖 在 pubspec.yaml 中添加：
dependencies:
  fluttertoast: ^8.2.4
  1. 导入并使用
import 'package:fluttertoast/fluttertoast.dart';

// 基本用法
Fluttertoast.showToast(
  msg: "这是一个Toast",
  toastLength: Toast.LENGTH_SHORT,
  gravity: ToastGravity.BOTTOM,
  timeInSecForIosWeb: 1,
  backgroundColor: Colors.grey[700],
  textColor: Colors.white,
  fontSize: 16.0
);

方法二：使用 SnackBar（Material Design 风格）

// 在 Scaffold 环境中使用
final snackBar = SnackBar(
  content: Text('这是一个SnackBar'),
  duration: Duration(seconds: 2),
  action: SnackBarAction(
    label: '确定',
    onPressed: () {},
  ),
);

ScaffoldMessenger.of(context).showSnackBar(snackBar);

主要参数说明

fluttertoast：

  • msg: 显示文本
  • toastLength: 显示时长（SHORT/LONG）
  • gravity: 位置（TOP/CENTER/BOTTOM）
  • backgroundColor: 背景色
  • textColor: 文字颜色

推荐使用 fluttertoast 库，因为它更接近原生 Toast 效果，支持自定义样式，且不依赖 Scaffold 环境。

回到顶部