当前位置:   article > 正文

flutter中的SnackBar_flutter showsnackbar

flutter showsnackbar

先看一下什么是SnackBar,如下图:

                                                          image

 SnackBar是用户操作后,显示提示信息的一个控件,类似Toast,会自动隐藏。它还可以添加操作按钮,等等。SnackBar是通过ScaffoldshowSnackBar方法来显示的。所以要显示一个SnackBar,要先拿到Scaffold。

创建Scaffold

  1. new Scaffold(
  2. appBar: new AppBar(
  3. title: new Text('SnackBar Demo'),
  4. ),
  5. body: new SnackBarPage(),
  6. );

显示SnackBar

首先创建一个SnackBar,再通过Scaffold的方法来显示。

  1. final snackBar = new SnackBar(content: new Text('这是一个SnackBar!'));
  2. Scaffold.of(context).showSnackBar(snackBar);

给SnackBar添加一个操作按钮

有时候,我们可能会想在显示的提示信息上添加一些操作。例如提示用户删除了一条消息,可以在提示信息上添加一个撤消的按钮,要达到这个效果,我们可以在SnackBar上添加一个操作按钮。

  1. final snackBar = new SnackBar(
  2. context: new Text('删除信息'),
  3. action: new SnackBarAction(
  4. label: '撤消',
  5. onPressed: () {
  6. // do something to undo
  7. }
  8. ),
  9. );

注意事项

当BuildContext在Scaffold之前时,调用Scaffold.of(context)会报错。这时可以通过Builder Widget来解决,代码如下:

  1. body: new Builder(builder: (BuildContext context) {
  2. return new Center(
  3. child: new GestureDetector(
  4. onTap: () {
  5. final snackBar =
  6. new SnackBar(content: new Text('这是一个SnackBar'));
  7. Scaffold.of(context).showSnackBar(snackBar);
  8. },
  9. child: new Text('显示SnackBar'),
  10. ),
  11. );
  12. })

 

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/小小林熬夜学编程/article/detail/124413
推荐阅读
相关标签
  

闽ICP备14008679号