Posso criar algo semelhante ao Toasts in Flutter? Apenas uma pequena janela de notificação que não está diretamente na cara do usuário e não bloqueia ou desbota a vista por trás dela?

Você pode acessar o pai ScaffoldStateusandoScaffold.of(context)

Então faça algo como

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

Snackbars são o "brinde" oficial do design do material. Consulte https://material.io/design/components/snackbars.html#usage

Aqui está um exemplo completo:

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),
      ),
    );
  }
}

Use este plugin

Fluttertoast.showToast(
        msg: "This is Toast messaget",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIos: 1
    );

SnackBar é definitivamente a classe certa a ser usada, como apontado por Darky.

Uma coisa complicada showSnackBaré chegar ao ScaffoldState, se você está tentando chamar showSnackBardentro do método de construção onde você constrói o seu Scaffold.

Você pode ver um erro como este, que inclui algum texto explicando como resolver o problema.

══╡ EXCEPTION CAUGHT BY GESTURE ╞═══════════════════════════════════════════════════════════════════
The following assertion was thrown while handling a gesture:
Scaffold.of() called with a context that does not contain a Scaffold.
No Scaffold ancestor could be found starting from the context that was passed to Scaffold.of(). This
usually happens when the context provided is from the same StatefulWidget as that whose build
function actually creates the Scaffold widget being sought.
There are several ways to avoid this problem. The simplest is to use a Builder to get a context that
is "under" the Scaffold. For an example of this, please see the documentation for Scaffold.of():
  https://docs.flutter.io/flutter/material/Scaffold/of.html
A more efficient solution is to split your build function into several widgets. This introduces a
new context from which you can obtain the Scaffold. In this solution, you would have an outer widget
that creates the Scaffold populated by instances of your new inner widgets, and then in these inner
widgets you would use Scaffold.of().
A less elegant but more expedient solution is assign a GlobalKey to the Scaffold, then use the
key.currentState property to obtain the ScaffoldState rather than using the Scaffold.of() function.
The context used was:
  MyHomePage
When the exception was thrown, this was the stack:
#0      Scaffold.of (package:flutter/src/material/scaffold.dart:444:5)
#1      MyHomePage.build.<anonymous closure> (/Users/jackson/Library/Developer/CoreSimulator/Devices/7072C907-DBAD-44FE-8F40-0257442C51D9/data/Containers/Data/Application/77FEC1A4-1453-442C-8208-96E0323DEFB2/tmp/so_scratch2Tkq9Jb/so_scratch2/lib/main.dart:23:24)
#2      _InkResponseState._handleTap (package:flutter/src/material/ink_well.dart:323:14)
#3      _InkResponseState.build.<anonymous closure> (package:flutter/src/material/ink_well.dart:375:30)
#4      GestureRecognizer.invokeCallback (package:flutter/src/gestures/recognizer.dart:102:24)
#5      TapGestureRecognizer._checkUp (package:flutter/src/gestures/tap.dart:149:9)
#6      TapGestureRecognizer.acceptGesture (package:flutter/src/gestures/tap.dart:119:7)
#7      GestureArenaManager.sweep (package:flutter/src/gestures/arena.dart:156:27)
#8      BindingBase&SchedulerBinding&GestureBinding.handleEvent (package:flutter/src/gestures/binding.dart:147:20)
#9      BindingBase&SchedulerBinding&GestureBinding.dispatchEvent (package:flutter/src/gestures/binding.dart:121:22)
#10     BindingBase&SchedulerBinding&GestureBinding._handlePointerEvent (package:flutter/src/gestures/binding.dart:101:7)
#11     BindingBase&SchedulerBinding&GestureBinding._flushPointerEventQueue (package:flutter/src/gestures/binding.dart:64:7)
#12     BindingBase&SchedulerBinding&GestureBinding._handlePointerDataPacket (package:flutter/src/gestures/binding.dart:48:7)
#13     _invoke1 (file:///b/build/slave/Mac_Engine/build/src/flutter/lib/ui/hooks.dart:100)
#14     _dispatchPointerDataPacket (file:///b/build/slave/Mac_Engine/build/src/flutter/lib/ui/hooks.dart:58)
Handler: onTap
Recognizer:
  TapGestureRecognizer#69dbc(debugOwner: GestureDetector, state: ready)
════════════════════════════════════════════════════════════════════════════════════════════════════

Você pode passar um GlobalKeypara o seu Scaffoldconstrutor:

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final key = new GlobalKey<ScaffoldState>();
    return new Scaffold(
      key: key,
      floatingActionButton: new Builder(
        builder: (BuildContext context) {
          return new FloatingActionButton(
            onPressed: () {
              key.currentState.showSnackBar(new SnackBar(
                content: new Text("Sending Message"),
              ));
            },
            tooltip: 'Increment',
            child: new Icon(Icons.add),
          );
        }
      ),
    );
  }
}

Ou você pode usar a Builderpara criar BuildContextum filho do Andaime.

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      floatingActionButton: new Builder(
        builder: (BuildContext context) {
          return new FloatingActionButton(
            onPressed: () {
              Scaffold.of(context).showSnackBar(new SnackBar(
                content: new Text("Sending Message"),
              ));
            },
            tooltip: 'Increment',
            child: new Icon(Icons.add),
          );
        }
      ),
    );
  }
}

Por fim, você pode dividir seu widget em várias classes, que é a melhor abordagem a longo prazo.

para mostrar a mensagem do brinde, você pode usar o plugin flutterToast para usar este plugin, você precisa

1. Adicione esta dependência ao seu arquivo pubspec.yaml: - fluttertoast: ^3.1.0
2. Para obter o pacote, você precisa executar este comando: - $ flutter packages get
3. importe o pacote: - import 'package:fluttertoast/fluttertoast.dart';

use-o assim

Fluttertoast.showToast(
        msg: "your message",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.BOTTOM // also possible "TOP" and "CENTER"
        backgroundColor: "#e74c3c",
        textColor: '#ffffff');

Para mais informações, verifique isto

fluttertoast: ^ 3.1.3

import 'package:fluttertoast/fluttertoast.dart';

Fluttertoast.showToast(
        msg: "This is Center Short Toast",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIos: 1,
        backgroundColor: Colors.red,
        textColor: Colors.white,
        fontSize: 16.0
    );

Gostaria de fornecer uma solução alternativa para usar o flushbar do pacote. https://github.com/AndreHaueisen/flushbar
Como o pacote dizia: Use este pacote se precisar de mais personalização ao notificar seu usuário. Para desenvolvedores do Android, ele é feito para substituir brindes e lanchonetes.
Outra sugestão para usar o flushbar Como mostrar snackbar após navigator.pop (context) no Flutter?
Você também pode definir flushbarPosition como TOP ou BOTTOM

    Flushbar(
      title: "Hey Ninja",
      message: "Lorem Ipsum is simply dummy text of the printing and typesetting industry",
      flushbarPosition: FlushbarPosition.TOP,
      flushbarStyle: FlushbarStyle.FLOATING,
      reverseAnimationCurve: Curves.decelerate,
      forwardAnimationCurve: Curves.elasticOut,
      backgroundColor: Colors.red,
      boxShadows: [BoxShadow(color: Colors.blue[800], offset: Offset(0.0, 2.0), blurRadius: 3.0)],
      backgroundGradient: LinearGradient(colors: [Colors.blueGrey, Colors.black]),
      isDismissible: false,
      duration: Duration(seconds: 4),
      icon: Icon(
        Icons.check,
        color: Colors.greenAccent,
      ),
      mainButton: FlatButton(
        onPressed: () {},
        child: Text(
          "CLAP",
          style: TextStyle(color: Colors.amber),
        ),
      ),
      showProgressIndicator: true,
      progressIndicatorBackgroundColor: Colors.blueGrey,
      titleText: Text(
        "Hello Hero",
        style: TextStyle(
            fontWeight: FontWeight.bold, fontSize: 20.0, color: Colors.yellow[600], fontFamily: "ShadowsIntoLightTwo"),
      ),
      messageText: Text(
        "You killed that giant monster in the city. Congratulations!",
        style: TextStyle(fontSize: 18.0, color: Colors.green, fontFamily: "ShadowsIntoLightTwo"),
      ),
    )..show(context);

Importar a lib

fluttertoast: 3.1.3

Use como abaixo

Fluttertoast.showToast(
msg: "Hello world",
textColor: Colors.white,
toastLength: Toast.LENGTH_SHORT,
timeInSecForIos: 1,
gravity: ToastGravity.BOTTOM,
backgroundColor: Colors.indigo,

);

Caso o pacote Fluttertoast fornecido até agora não funcione ... Então, sugiro que tente brindar .
Não tem frescura nem cerimônia.

Isso simplesmente funciona.

Notei um bug no exemplo fornecido no seu Readme:

Toast.show("Toast plugin app", duration: Toast.LENGTH_SHORT, gravity: Toast.BOTTOM);

Enquanto o método requer um contexto. Então faça bem em adicionar 'contexto' assim:

Toast.show("Toast plugin app", context, duration: Toast.LENGTH_SHORT, gravity: Toast.BOTTOM);

Há uma chance de que isso tenha sido corrigido no momento em que você verificou, já enviei um PR.

Existem três maneiras de mostrar torradas no App Flutter.
Vou falar sobre as três maneiras que eu conheço e escolher qual você deseja usar. Eu recomendaria o segundo.

1: uso de pacote externo.

este é o primeiro método que é a maneira mais fácil de mostrar torradas no aplicativo vibração.

Antes de tudo, você deve adicionar este pacote no pubspec.yaml

flutter_just_toast:^version_here

depois importe o pacote no arquivo em que deseja mostrar o brinde.

'package:flutter_just_toast/flutter_just_toast.dart';

e o último passo mostra a torrada.

Toast.show( message: "Your toast message", 
           duration: Delay.SHORT, 
           textColor: Colors.black);

2: usando maneira oficial.

esse método também é simples, mas você precisa lidar com isso. Eu não estou dizendo que é difícil, é simples e limpo, eu recomendaria este método.

para esse método, tudo o que você precisa fazer é mostrar o brinde usando o código abaixo.

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

mas lembre-se de que você deve usar o contexto do andaime.

3: usando API nativa.

agora esse método não faz mais sentido quando você já possui os dois métodos acima. Usando esse método, você deve escrever um código nativo para Android e iOS e, em seguida, convertê-lo em plug-in e pronto. esse método consumirá seu tempo e você precisará reinventar a roda. que já foi inventado.

Para aqueles que procuram o Toastque pode sobreviver à rota, muda oSnackBar pode não ser a melhor opção.

Dê uma olhada em seu Overlaylugar.

https://api.flutter.dev/flutter/widgets/Overlay-class.html

Adicione flutter_just_toast às suas dependências no seu Pubspecs.yaml

dependências:

flutter_just_toast: ^1.0.1

Próximo pacote de importação para sua classe:

import 'package:flutter_just_toast/flutter_just_toast.dart';

Implementar o Toast com mensagem

Toast.show( message: "Your toast message", 
    duration: Delay.SHORT, 
    textColor: Colors.black);

basta usar SnackBar (conteúdo: Texto ("olá")) em qualquer evento como onTap e onPress

você pode ler mais sobre o Snackbar aqui https://flutter.dev/docs/cookbook/design/snackbars

Para isso, existem versões diferentes.

1) Primeiro de tudo, você pode usar o SnackBar, que é um widget no Flutter.

2) Você pode usar bibliotecas como toast, flutter_toast de pub.dev.

3) A terceira versão está criando seu widget personalizado. Ele pode ser criado usando o widget Overlay e Animation in Flutter.

Você pode este tutorial para aprender mais sobre isso. Aqui está um link

Para torradas com gráficos originais do Android, você pode usar este: https://pub.dartlang.org/packages/fluttertoast

Funciona bem no Android e iOS. insira a descrição da imagem aqui

https://pub.dev/packages/toast use isso para brindar esta biblioteca é muito fácil de usar e funciona perfeitamente para ios e android,

Sintaxe do show Toast:

Toast.show("Toast plugin app", duration: Toast.LENGTH_SHORT, gravity:  Toast.BOTTOM);

Passo 1:

dependências:

flutter_just_toast: ^1.0.1

Passo 2:

import 'package:flutter_just_toast/flutter_just_toast.dart';

Etapa 3:

Toast.show(
message: "Your toast message",
duration: Delay.SHORT,
textColor: Colors.black);

use esta dependência: toast: ^0.1.3 importe a dependência do brinde na página: import 'package:toast/toast.dart'; em seguida, em onTap () do widget: Toast.show("Toast plugin app", context,duration: Toast.LENGTH_SHORT, gravity: Toast.BOTTOM);

você pode usar este pacote: brinde

adicione esta linha às suas dependências

toast: ^0.1.5

use-o assim:

import 'package:toast/toast.dart';
Toast.show("Toast plugin app", context, duration: Toast.LENGTH_SHORT, gravity:  Toast.BOTTOM);

obter pacote brinde vibração aqui

Adicione este pacote às dependências do seu projeto em pubspec.yaml

Então, sempre que você quiser que o Toast seja exibido como um toque de um botão

Toast.show("Toast plugin app", context, duration: Toast.LENGTH_SHORT, gravity:  Toast.BOTTOM);

Não há nenhum widget para o brinde em vibração, Você pode ir a este plugin Usecase:

Fluttertoast.showToast(
msg: "My toast messge",
textColor: Colors.white,
toastLength: Toast.LENGTH_SHORT,
timeInSecForIos: 1,
gravity: ToastGravity.BOTTOM,
backgroundColor: Colors.indigo,);

Você pode usar a biblioteca "fluttertoast". Para fazer isso, adicione-o no arquivo pubspec.yaml como:

dependencies:
  fluttertoast: ^3.1.0

Em seguida, importe essa biblioteca para o arquivo dardo em que você precisa do brinde e escreva seu código. Por exemplo, consulte o seguinte código:

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



class ToastExample extends StatefulWidget {
    @override
    _ToastExampleState createState() {
      return _ToastExampleState();
    }
  }

  class _ToastExampleState extends State {
    void showToast() {
      Fluttertoast.showToast(
          msg: 'Some text',
          toastLength: Toast.LENGTH_SHORT,
          gravity: ToastGravity.CENTER,
          timeInSecForIos: 1,
          backgroundColor: Colors.red,
          textColor: Colors.white
      );
    }

    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        title: 'Toast Tutorial',
        home: Scaffold(
            appBar: AppBar(
              title: Text('Toast Tutorial'),
            ),
            body: Padding(
              padding: EdgeInsets.all(15.0),
              child: Center(
                child: RaisedButton(
                  child: Text('Press to show'),
                  onPressed: showToast,
                ),
              ),
            )
        ),
      );
    }
  }

  void main() => runApp(ToastExample());

Importe cupertino_icons: ^0.1.2 e escreva o código abaixo

showToast(BuildContext context, String message) {
 showDialog(
context: context,
builder: (BuildContext context) {
return CupertinoAlertDialog( 
title: Text("Name of App",
          content: Text(message,
          actions: <Widget>[
            FlatButton(
              child: Text("OK"),
              onPressed: () {
                Navigator.of(context).pop();
              },
            )
          ],
        );
      });

Para a mensagem de brinde no flutter, use a biblioteca bot_toast . Esta biblioteca oferece suporte rico em recursos para exibição de notificações, texto, carregamento, anexos, etc.

É bem simples

Nós apenas temos que instalar o pacote de brinde de vibração. Consulte a seguinte documentação: https://pub.dev/packages/fluttertoast

Na guia de instalação, você obterá a dependência necessária para colá-la no pubspec.yaml e depois na instalação.

Depois disso, basta importar o pacote:

import 'pacote: fluttertoast / fluttertoast.dart';

Semelhante à linha acima.

E então, usando a classe FlutterToast, você pode usar o seu fluttertoast.

Você Terminou!!!

É bastante fácil mostrar uma mensagem do Toast no Flutter.Scaffold.of(context).showSnackBar(SnackBar( content: Text("Toast Text Here"), ));

Você pode usar algo como FlutterToast

Importar a lib

fluttertoast: ^2.1.4

Use como abaixo

Fluttertoast.showToast(
    msg: "Hello world",
    textColor: Colors.white,
    toastLength: Toast.LENGTH_SHORT,
    timeInSecForIos: 1,
    gravity: ToastGravity.BOTTOM,
    backgroundColor: Colors.indigo,
);

É isso aí..