SnackBar的使用

What is Snackbar?

Snackbar是Android Support Design Library库中的一个控件,效果是可以在屏幕底部弹出消息,作用与使用方法都与Toast类似。(图见下文啦)

使用套路

1.Snackbar需要引入com.android.support:design库

打开module对应的gradle.build文件,在dependencies中添加这一行语句(后面的版本号按需改变)

compile 'com.android.support:design:23.3.0'

2.Snackbar普通用法

Sanckbar的原型为

Snackbar.make(view,"this is message",showtime).setAction("ActionName",ction).show();

用起来可以是这样

 Snackbar.make(view,"This is normal SnackBar Msg",Snackbar.LENGTH_SHORT)
                        .setAction("ActionName", new View.OnClickListener() {
                            @Override
                            public void onClick(View v) {
                                Toast.makeText(SnackBarActivity.this,"You clicked SnackBar Action",Toast.LENGTH_SHORT).show();
                            }
                        }).show();

效果如下(左侧为message,右侧为可以响应的action按钮)


还可以通过setActionTextColor方法来修改action文件的颜色

自定义Snackbar

Snackbar用起来是够简单的,但是花样不多啊,Snackbar没有提供其他改变样式的函数,所以我们就diy吧
据说这是Snackbar的布局文件

<merge xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
        android:id="@+id/snackbar_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:paddingTop="14dp"
        android:paddingBottom="14dp"
        android:paddingLeft="12dp"
        android:paddingRight="12dp"
        android:textAppearance="@style/TextAppearance.Design.Snackbar.Message"
        android:maxLines="2"
        android:layout_gravity="center_vertical|left|start"
        android:ellipsize="end"
        android:textAlignment="viewStart"/>

<Button
        android:id="@+id/snackbar_action"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="0dp"
        android:layout_marginStart="0dp"
        android:layout_gravity="center_vertical|right|end"
        android:paddingTop="14dp"
        android:paddingBottom="14dp"
        android:paddingLeft="12dp"
        android:paddingRight="12dp"
        android:visibility="gone"
        android:textColor="?attr/colorAccent"
        style="?attr/borderlessButtonStyle"/>
</merge>

根据以上布局,有一个TextView和一个Button,很明显TextView对应Snackbar的Message,Button对应右侧的Action,那么这样就好吧办了,通过findViewById获取到TextView控件的引用,然后就可以"为所欲为"啦。
来个简单的例子

 Snackbar snackbar=Snackbar.make(v,"This is normal SnackBar Msg",Snackbar.LENGTH_SHORT)
                        .setAction("ActionName", new View.OnClickListener() {
                            @Override
                            public void onClick(View v) {
                                Toast.makeText(SnackBarActivity.this,"You clicked SnackBar Action",Toast.LENGTH_SHORT).show();
                            }
                        });

                snackbar.setActionTextColor(Color.YELLOW);//设置action颜色
                View view=snackbar.getView();
                view.setBackgroundColor(Color.GRAY);//设置背景颜色
                TextView msg= (TextView) view.findViewById(R.id.snackbar_text);
                msg.setTextColor(Color.GREEN);//设置左侧message颜色
                snackbar.show();

效果

其他的玩法

还可以在Snackbar里面添加图标,以后继续。

posted @ 2016-07-15 17:23  xdzhcs  阅读(2204)  评论(0编辑  收藏  举报