还在用Toast?试试Snackbar!

作者: 尹star | 来源:发表于2016-06-25 10:46 被阅读3280次

SnackBar是 Android Support Library 22.2.0 里面新增提供的一个控件,可以把它理解成一个加强版的Toast,或者是一个轻量级的Dialog。SnackBar默认从屏幕底部弹出,像Toast一样会自动消失,当然也可以手动划出屏幕消失。Toast是不能交互的,而如果需要,SnackBar默认是可以添加一个点击事件的。官方也是推荐使用Snackbar代替Toast,你的项目中还在用Toast吗?不妨试试炫酷的SnackBar!

snackbar.gif

Snackbar的用法几乎和Toast一毛一样:

Toast这么写:

Toast.makeText(context, "it is Toast", Toast.LENGTH_SHORT).show();

Snackbar这么写:

Snackbar.make(view, "it is Snackbar", Snackbar.LENGTH_SHORT).show();

二者都有三个参数,区别就在于第一个参数,其中Toast传入的是Context,而Snackbar传入的是View。Context已无需多讲,而Snackbar的参数中传入一个View是几个意思呢?先说下Toast吧,其实Toast是个系统级窗口,相当于悬浮在所有View的上面。而SnackBar却不是这样,它需要有一个View来承载,SnackBar会遍历整个View Tree来找到一个合适的View承载SnackBar的View,如果你想要实现上面的动画交互效果的话最好是传入CoordinatorLayout对象,而如果传入RelativeLayout或者LinearLayout是不会有动画效果的。那CoordinatorLayout是个什么玩意呢?以后有机会再专门介绍吧,这里就先不讲了。

前面已经说了Snackbar可以加一个点击事件,加起来有相当简单:

 Snackbar.make(findViewById(R.id.tv), "it is Snackbar", Snackbar.LENGTH_SHORT)
                        .setAction("点我", new View.OnClickListener() {
                            @Override
                            public void onClick(View v) {
                                Toast.makeText(MainActivity.this, "it is Toast", Toast.LENGTH_SHORT).show();
                            }

                        }) .show();

click.gif

我去,按钮(“点我”)居然是玫红色,不要担心,这个当然是可以自定义的,只需要加一个颜色就好。

 Snackbar.make(findViewById(R.id.tv), "it is Snackbar", Snackbar.LENGTH_SHORT)
                        //设置按钮颜色
                        .setActionTextColor(Color.WHITE)
                        .setAction("点我", new View.OnClickListener() {
                            @Override
                            public void onClick(View v) {
                                Toast.makeText(MainActivity.this, "it is Toast", Toast.LENGTH_SHORT).show();
                            }

                        }) .show();

这样就变成了白色。

另外SnackBar还贴心的提供了关于show和dismiss的回调方法:

  Snackbar.make(findViewById(R.id.tv), "it is Snackbar", Snackbar.LENGTH_SHORT)
                        .setActionTextColor(Color.WHITE)
                        .setCallback(new Snackbar.Callback() {
                            @Override
                            public void onDismissed(Snackbar snackbar, int event) {
                                super.onDismissed(snackbar, event);
                                Toast.makeText(MainActivity.this, "Snackbar dismiss", Toast.LENGTH_SHORT).show();
                            }

                            @Override
                            public void onShown(Snackbar snackbar) {
                                super.onShown(snackbar);
                                Toast.makeText(MainActivity.this, "Snackbar show", Toast.LENGTH_SHORT).show();
                            }
                        })
                        .setAction("点我", new View.OnClickListener() {
                            @Override
                            public void onClick(View v) {
                                Toast.makeText(MainActivity.this, "it is Toast", Toast.LENGTH_SHORT).show();
                            }

                        }) .show();

尽管Snackbar已经很炫酷很漂亮,但我知道它依然无法满足你不走寻常路的心,那要不然我们再想办法自定义一个呗。那我们先改变下Snackbar的背景色或者背景图吧。

  Snackbar bar=Snackbar.make(findViewById(R.id.tv), "it is Snackbar",Snackbar.LENGTH_SHORT);
                View v=bar.getView();
                v.setBackgroundColor(Color.GREEN);
                bar.show();
1.pic.png

什么?你还不满意,还要改变显示位置?还要加个icon?动画也要改一改?没关系,都可以。

 Snackbar mSnackbar=Snackbar.make(findViewById(R.id.tv), "it is Snackbar", Snackbar.LENGTH_SHORT);
                View v=mSnackbar.getView();
                ViewGroup.LayoutParams vl = v.getLayoutParams();
                CoordinatorLayout.LayoutParams cl = new CoordinatorLayout.LayoutParams(vl.width,vl.height);
                //设置字体为红色
                ((TextView) v.findViewById(R.id.snackbar_text)).setTextColor(Color.RED);
                //设置显示位置居中
                cl.gravity = Gravity.CENTER;
                v.setLayoutParams(cl);
                //设置背景色为绿色
                v.setBackgroundColor(Color.GREEN);
                //自定义动画
                //v.setAnimation();
                //设置icon
                ImageView iconImage=new ImageView(MainActivity.this);
                iconImage.setImageResource(R.mipmap.ic_launcher);
                //icon插入布局
                Snackbar.SnackbarLayout snackbarLayout = (Snackbar.SnackbarLayout) v;
                snackbarLayout.addView(iconImage,0);
                //设置按钮为蓝色
                mSnackbar.setActionTextColor(Color.BLUE).setAction("点我", new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {

                    }
                }).show();
snackbar.png

代码略乱,童鞋们可以根据自己的业务需求做封装。

相关文章

网友评论

  • fendo:赞一个!!
  • evanwo:看完以后有个地方不明白,snackbar 第一个参数R.id.tv 是指snackbar 这个layout的根布局?还是linearlayout或者CoordinatorLayout呢?
  • evanwo:看完以后有个地方不明白,snackbar 第一个参数R.id.tv 是指snackbar 这个layout的根布局?还是linearlayout或者CoordinatorLayout呢?
  • 相互交流:我看看,你这样修改布局文件好麻烦啊,我想应该有自定义布局功能吧...
  • 相互交流:android 4.0 系统上面能使用不???
    尹star:@相互交流 可以的
  • f4ba92460139:支持了compile 'com.android.support:design:23.1.1' 为什么还是不行
  • 繁体字遇上简体字:请问这个图片可以控制位置吗,比如居中
    繁体字遇上简体字:@尹star 应该是居中不了的,如果可以那这个就功能强大了,可以代替dialog,popwinder.
    尹star: @繁体字遇上简体字 看样子不太好搞,如果非要居中应该也有办法吧。
  • 程序猿老王:学习了
  • 瓦雷:你的hot项目可以支持jdk7么,如果可以请问配置怎么修改呢?
  • 44e8c0843e3d:看不同情况 这个东西虽然效果不错 但实用性还是不太高 不能完全代替toast
    尹star:@Rose_Tango 微信就用了
  • 8a1133fffe23:这个很有意思,可以自己尝试一下,非常棒!!
  • 5fc7946f4aac:API LEVEL最低支持多少呢
    尹star:@大侠爱吃汉堡包 可以导支持包
  • 积木Blocks::joy:最近打算总结下Toast的,感觉Toast和Snackbar还是有点不同的,你们是基本用Snackbar代替了Toast,还是都用呢?。比如这样一个场景输入框输入信息,我写了一个校验用来检测,如果输入错误,用Toast提示我可以直接提示,而Snackbar则需要先把键盘隐藏下来。
    itzhu:有edittext的可以用showerror啊
    积木Blocks:@尹star Toast感觉就是在布局之外,而Snackbar如果不拉下来键盘,就看不到显示。具体原理我也不清楚。多谢了!
    尹star:@自导自演的机器人 看使用场景喽,软键盘这个还没研究过。

本文标题:还在用Toast?试试Snackbar!

本文链接:https://www.haomeiwen.com/subject/xboldttx.html