Flutter SnackBar 提示信息

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

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

 参数详解

属性说明
content内容
backgroundColor背景颜色
elevation阴影高度
shape形状
behavior

位置

SnackBarBehavior.fixed // 固定在底部

behavior:SnackBarBehavior.floating,//显示在[底部导航栏]上方

action动作(通常放按钮)
duration停留时间,如一秒:Duration(seconds: 1),
animation显示/隐藏动画

代码示例

//定义一个SnackBar
final snackBar = new SnackBar(content: new Text('这是一个SnackBar!'));

//显示SnackBar
Scaffold.of(context).showSnackBar(snackBar);

 Builder 用法

Builder(builder: (BuildContext context) {
  return Center(
    child: InkWell(
      onTap: () {
        //定义
        final mySnackBar = SnackBar(
          content: Text('我是SnackBar'),
          backgroundColor: Colors.black26,
          duration: Duration(seconds: 1),
          behavior:SnackBarBehavior.floating,
          action: SnackBarAction(
            label: '我是scackbar按钮', 
            onPressed: () {
              print('点击了snackbar按钮');
            }
          ),
        );
        //显示
        Scaffold.of(context).showSnackBar(mySnackBar);
      },
      child: Padding(padding: EdgeInsets.all(10),child: Text('点 我'),),
    ),
  );
}),

效果图

完整代码

查看完整代码

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

马志武

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值