flutter: 用fluttertoast显示toast消息

一，安装第三方库

库地址:

https://pub.dev/packages/fluttertoast

编辑pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  path_provider: ^2.1.5
  audioplayers: ^6.4.0
  flutter_sound: ^9.26.0
  permission_handler: ^11.4.0
  file_picker: ^9.2.1
  http: ^1.3.0
  dio: ^5.8.0+1
  fluttertoast: ^8.2.12

然后点击pub get

 

二，代码:

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


class ToastPage extends StatefulWidget {
  final Map arguments;

  // 为title设置一个默认参数，这样的跳转该界面时可以不传值。
  ToastPage({super.key, required this.arguments});
  @override
  State<ToastPage> createState() => _ToastPageState();
}

class _ToastPageState extends State<ToastPage> {
  FToast fToast = FToast();
  //自定义消息的widget
  Widget getMsgToast(String msg) {
    Widget myMsgToast = Container(
      padding: const EdgeInsets.symmetric(horizontal: 24.0, vertical: 12.0),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(25.0),
        color: Colors.greenAccent,
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          Icon(Icons.check),
          SizedBox(
            width: 12.0,
          ),
          Text(msg),
        ],
      ),
    );
    return myMsgToast;
  }


  @override
  void initState() {
    super.initState();
    fToast = FToast();
    // if you want to use context from globally instead of content we need to pass navigatorKey.currentContext!
    fToast.init(context);
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.primaryContainer,
        title: Text(widget.arguments["title"]),
      ),

      body: Center(
          child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
         ElevatedButton(
          onPressed: () {

            Fluttertoast.showToast(
                msg: "这里一条居中的短Toast",
                toastLength: Toast.LENGTH_LONG,   //时长长一些
                gravity: ToastGravity.CENTER,
                timeInSecForIosWeb: 1,
                backgroundColor: Colors.red,
                textColor: Colors.white,
                fontSize: 16.0,
                //duration
            );

          },
          child: Row(
            mainAxisSize: MainAxisSize.min, // 根据内容调整大小
            children: <Widget>[
              Icon(Icons.add), // 图标在左侧
              SizedBox(width: 10), // 可选：添加一些间隔
              Text("通用toast"), // 文本在右侧
            ],
          ),
        ),
                SizedBox(height: 16),
                ElevatedButton(
                  onPressed: () {

                    fToast.showToast(
                      child: getMsgToast("页面上的按钮被点击了..."),
                      gravity: ToastGravity.CENTER,
                      toastDuration: Duration(seconds: 2),
                    );

                  },
                  child: Row(
                    mainAxisSize: MainAxisSize.min, // 根据内容调整大小
                    children: <Widget>[
                      Icon(Icons.add), // 图标在左侧
                      SizedBox(width: 10), // 可选：添加一些间隔
                      Text("自定义toast"), // 文本在右侧
                    ],
                  ),
                ),
        ],
      ),
          ),
    );
  }
}

 

三，测试效果: