如何在Flutter中创建Toast? [英] How to create Toast in Flutter?

问题描述

我可以在Flutter中创建类似于 Toasts 的内容吗? ?只是一个很小的通知窗口，它不直接在用户面前，并且不会锁定或淡化它后面的视图?

Can I create something similar to Toasts in Flutter? Just a tiny notification window that is not directly in the face of the user and does not lock or fade the view behind it?

推荐答案

您可以使用Scaffold.of(context)

然后做类似

Scaffold.of(context).showSnackBar(SnackBar(
      content: Text("Sending Message"),
    ));

小吃店是材料设计中的官方吐司".参见 https://material.io/design/components/snackbars.html#usage

Snackbars are the official "Toast" from material design. See https://material.io/design/components/snackbars.html#usage

这是一个可以正常工作的示例:

Here is a fully working example:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const Home(),
    );
  }
}

class Home extends StatelessWidget {
  const Home({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Snack bar'),
      ),

      /// We use [Builder] here to use a [context] that is a descendant of [Scaffold]
      /// or else [Scaffold.of] will return null
      body: Builder(
        builder: (context) => Center(
              child: RaisedButton(
                child: const Text('Show toast'),
                onPressed: () => _showToast(context),
              ),
            ),
      ),
    );
  }

  void _showToast(BuildContext context) {
    final scaffold = Scaffold.of(context);
    scaffold.showSnackBar(
      SnackBar(
        content: const Text('Added to favorite'),
        action: SnackBarAction(
            label: 'UNDO', onPressed: scaffold.hideCurrentSnackBar),
      ),
    );
  }
}

这篇关于如何在Flutter中创建Toast?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！