我可以在Flutter中创建类似Toasts的东西吗?

只是一个很小的通知窗口,不直接面对用户,也不锁定或淡出它后面的视图。


当前回答

你可以直接使用小吃店的元素

 ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(
        content: Text("Successfully!"),
        behavior: SnackBarBehavior.floating,
        margin: EdgeInsets.all(20),
          shape: StadiumBorder(),
        action: SnackBarAction(
          label: 'Dismiss',
          disabledTextColor: Colors.white,
          textColor: Colors.blue,
          onPressed: () {
            //Do whatever you want
          },
        ),
      ),
    );

其他回答

你可以直接使用小吃店的元素

 ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(
        content: Text("Successfully!"),
        behavior: SnackBarBehavior.floating,
        margin: EdgeInsets.all(20),
          shape: StadiumBorder(),
        action: SnackBarAction(
          label: 'Dismiss',
          disabledTextColor: Colors.white,
          textColor: Colors.blue,
          onPressed: () {
            //Do whatever you want
          },
        ),
      ),
    );

你可以很容易地实现这种效果使用叠加。

代码:

OverlayEntry entry = OverlayEntry(builder: (context) {
              return Positioned(
                  top: MediaQuery.of(context).size.height * 0.8,
                  child: Container(
                    width: MediaQuery.of(context).size.width,
                    alignment: Alignment.center,
                    child: const Card(
                      color: Colors.redAccent,
                      child: Padding(
                        padding: EdgeInsets.all(8),
                        child: Text("This is a message."),
                      ),
                    ),
                  ));
            });

            //show overlay
            Overlay.of(context)!.insert(entry);
            //auto remove this overlay after 3 seconds
            Future.delayed(const Duration(seconds: 3)).then((value) => entry.remove());

截图:

您可以使用此链接在Flutter中显示Toast。

可以这样使用:

void method1(){

    Fluttertoast.showToast(
        msg: "This is Add Button",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIosWeb: 1,
        backgroundColor: Colors.blueGrey,
        textColor: Colors.white,
        fontSize: 14.0
    );
}

如果目前给出的Fluttertoast包不奏效,那么我建议你试试吐司。

它没有装饰,也没有仪式。

它就是有用。 我注意到在它的README文件中给出的例子中有一个错误: Toast.show ( “吐司插件应用程序”, 持续时间:烤面包。LENGTH_SHORT, 重力:Toast.BOTTOM); 而该方法需要一个上下文。所以要像这样添加“上下文”: Toast.show ( "Toast插件应用" 持续时间:烤面包。LENGTH_SHORT, 重力:Toast.BOTTOM); 有一个机会,这将在你检查的时候被修复。我已经提交了PR。

我想提供一个替代解决方案,以使用包刷新条。

正如包中所说:如果在通知用户时需要更多自定义,请使用此包。对于Android开发人员来说,它可以替代吐司和零食条。

使用flushbar的另一个建议是如何在Flutter的navigator.pop(context)之后显示小吃条?

你也可以设置flushbarPosition为TOP或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);