开发者社区> 登高且赋> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

Android Design Support Library全解:Part 2 Snackbar

简介: Android Design Support Library系列第2弹: Snackbar “Providing lightweight, quick feedback about an operation is a perfect opportunity to use a snackbar.
+关注继续查看

Android Design Support Library系列第2弹: Snackbar
“Providing lightweight, quick feedback about an operation is a perfect opportunity to use a snackbar.”

image.png

SnackBar是Design Support Library中很实用的控件,它可以在屏幕的底部展示快速消息,功能类似于Toast,但更加灵活和强大:

  • SnackBar会在交互或者超时之后自动消失;
  • SnackBar可以包含一个Action动作,来触发事件;
  • SnackBar所展示的信息是UI的界面的一部分,它将出现于所有页面元素的之下,而Toast的是覆盖UI界面;
  • 统一时间内,只会显示一条SnackBar

因为SnackBar和Toast的功能相近,所以SnackBar继承了很多Toast的属性和方法,比如标识显示时间长短的LENGTH_LONG and LENGTH_SHORT

使用方法

SnackBar的使用方法大致如下:

Snackbar.make(view, message, duration)
        .setAction(action message, click listener)
        .show();

其中:

  • make() – 创建SnackBar来显示信息;
  • setAction() – 设置Action事件;
  • show() – 显示SnackBar;

需要说明的参数:

  • make方法的第一个参数view,代表着SnackBar所要依附的父视图(parent view);
  • make方法的最后一个参数duration,代表着SnackBar出现的时间,超过该时间之后便会消失。

下面我们看一个实例:

Snackbar.make(rootlayout, "Hello SnackBar!", Snackbar.LENGTH_SHORT)
       .setAction("Undo", new View.OnClickListener() {
           @Override
           public void onClick(View v) {
               // 点击事件
           }
       })
       .show();

其中,rootlayout上一节中,包含FABframelayout,点击悬浮按钮就会弹出Snackbar

Snackbar-framelayout

虽然Snackbar出现了,但是和我们预期的还是有差距,我们希望Snarkbar出现在最下方时,FAB等控件可以随之上移,比如下面的效果:

Snackbar-with-CoordinatorLayout

这就需要配合CoordinatorLayout 控件来使用,我们会在后续的篇章里介绍。

自定义Snackbar样式

虽然可以通过setActionTextColor方法来设置Action字体样式,但是在实际的使用中,往往需要让Snackbar显示出不同的样式(字体和颜色)来体现出不同的意义。
如何为Snackbar添加背景颜色

你可以通过getView() 方法获取Snackbar所在的View,然后就可以在对它采用任意的背景颜色:snackbar.getView().setBackgroundColor(colorId);

下面是ColoredSnackbar类,它利用装饰器模式封装了一些方法,可以根据用户指定的类型显示不同背景颜色。

//彩色
public class ColoredSnackbar {
    //红色
    private static final int red = 0xfff44336;
    //绿色
    private static final int green = 0xff4caf50;
    //蓝色
    private static final int blue = 0xff2195f3;
    //橙色
    private static final int orange = 0xffffc107;
 
    //获得当前SnackBar所在的View
    private static View getSnackBarLayout(Snackbar snackbar) {
        if (snackbar != null) {
            return snackbar.getView();
        }
        return null;
    }
 
    //装饰器
    private static Snackbar colorSnackBar(Snackbar snackbar, int colorId) {
        View snackBarView = getSnackBarLayout(snackbar);
        if (snackBarView != null) {
            snackBarView.setBackgroundColor(colorId);
        }
 
        return snackbar;
    }
 
    //使用蓝色表示一般信息
    public static Snackbar info(Snackbar snackbar) {
        return colorSnackBar(snackbar, blue);
    }
 
    //使用橙色表示提醒信息
    public static Snackbar warning(Snackbar snackbar) {
        return colorSnackBar(snackbar, orange);
    }
 
    //使用红色表示警告信息
    public static Snackbar alert(Snackbar snackbar) {
        return colorSnackBar(snackbar, red);
    }
 
    //使用绿色表示确认信息
    public static Snackbar confirm(Snackbar snackbar) {
        return colorSnackBar(snackbar, green);
    }
}

其使用方式很简单,先构建正常的SnackBar,然后调用ColoredSnackBar进行装饰:

Snackbar snackbar = Snackbar.make(getView(), R.string.hello_snackbar, Snackbar.LENGTH_SHORT);
ColoredSnackBar.alert(snackbar).show();

效果如下:

ColoredSnackBar

更多关于Design Support Library中控件的讲解将会在持续更新,欢迎关注。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Android Support Design Library之FloatingActionButton(二)
Android Support Design Library之FloatingActionButton(二)
0 0
Android Support Design Library之FloatingActionButton(一)
Android Support Design Library之FloatingActionButton(一)
0 0
Android Support Design Library之TextInputLayout(二)
Android Support Design Library之TextInputLayout(二)
0 0
Android Support Design Library之TextInputLayout(一)
Android Support Design Library之TextInputLayout(一)
0 0
Android Support Design Library之TabLayout
Android Support Design Library之TabLayout
0 0
Android Support Design Library之NavigationView(二)
Android Support Design Library之NavigationView(二)
0 0
Android Support Design Library之NavigationView(一)
Android Support Design Library之NavigationView(一)
0 0
Android Support Design Library之CoordinatorLayout(二)
Android Support Design Library之CoordinatorLayout(二)
0 0
Android Support Design Library之CoordinatorLayout(一)
Android Support Design Library之CoordinatorLayout(一)
0 0
Android【将已有的项目以Library的形式导入到另一个的项目中】
Android【将已有的项目以Library的形式导入到另一个的项目中】
0 0
+关注
登高且赋
在帝都和钱塘之间奔波的非主流程序员,前国重实验室里的基层科研工作者,现在在云栖中乘物以游心,搬砖能还房贷还能有远方。 之前专攻密码应用,认证与授权,现在在做ECS。
文章
问答
文章排行榜
最热
最新
相关电子书
更多
Android组件化实现
立即下载
蚂蚁聚宝Android秒级编译—— Freeline
立即下载
Android插件化:从入门到放弃
立即下载