前言

SnackBar是MD设计的一种控件，和Toast类似用来显示提示消息的轻量级控件。

准备工作

IDE

 Android Studio 2.3.3 

Gradle

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

SnackBar使用案例

布局文件

这里必须将根布局设置为CoordinatorLayout,才会有和FloatingActionButton交互把FloatingActionButton向上顶起的效果

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/cl_top"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.snackbar.MainActivity">

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:src="@mipmap/ic_launcher" />

</android.support.design.widget.CoordinatorLayout>

java代码

coordinatorLayout = (CoordinatorLayout) findViewById(R.id.cl_top);
        floatingActionButton = (FloatingActionButton) findViewById(R.id.fab_button);
        floatingActionButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Snackbar.make(coordinatorLayout, "snack弹出来了", Snackbar.LENGTH_INDEFINITE)
                        .setAction("action", new View.OnClickListener() {
                            @Override
                            public void onClick(View v) {
                                Toast.makeText(MainActivity.this, "toast", Toast.LENGTH_SHORT).show();
                            }
                        })
                        .setCallback(new Snackbar.Callback(){
                            @Override
                            public void onShown(Snackbar sb) {
                                super.onShown(sb);
                            }

                            @Override
                            public void onDismissed(Snackbar transientBottomBar, int event) {
                                super.onDismissed(transientBottomBar, event);
                            }
                        })
                        .setActionTextColor(Color.RED)
                        .show();
            }
        });

运行效果

qiandroid.gif

SnackBar-API介绍

               //第一个参数：用来容纳snackbar的容器，可以是任意view
                //第二个参数：snackbar左边的文字
                //第三个参数：snackbar显示时间多长
                Snackbar.make(v, "snack弹出来了", Snackbar.LENGTH_INDEFINITE)
                        //设置右边的文字和点击事件--注意右边实际上是一个Button后面会介绍
                        .setAction("action", new View.OnClickListener() {
                            @Override
                            public void onClick(View v) {
                                Toast.makeText(MainActivity.this, "toast", Toast.LENGTH_SHORT).show();
                            }
                        })
                        //设置显示和消失回调
                        .setCallback(new Snackbar.Callback() {
                            @Override
                            public void onShown(Snackbar sb) {
                                super.onShown(sb);
                            }

                            @Override
                            public void onDismissed(Snackbar transientBottomBar, int event) {
                                super.onDismissed(transientBottomBar, event);
                            }
                        })
                        //设置右边文字颜色
                        .setActionTextColor(Color.RED)
                        //显示snackbar,必须设置不然不会显示
                        .show();

SnackBar源码介绍

(1)设置SnackBar左边文字的颜色

首先我们来看看SnackBar的使用的布局

 final SnackbarContentLayout content =
                (SnackbarContentLayout) inflater.inflate(
                        R.layout.design_layout_snackbar_include, parent, false);

很明显它是来源于布局design_layout_snackbar_include，我们点进去看看

<view
    xmlns:android="http://schemas.android.com/apk/res/android"
    class="android.support.design.internal.SnackbarContentLayout"
    android:theme="@style/ThemeOverlay.AppCompat.Dark"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom">

    <TextView
        android:id="@+id/snackbar_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:paddingTop="@dimen/design_snackbar_padding_vertical"
        android:paddingBottom="@dimen/design_snackbar_padding_vertical"
        android:paddingLeft="@dimen/design_snackbar_padding_horizontal"
        android:paddingRight="@dimen/design_snackbar_padding_horizontal"
        android:textAppearance="@style/TextAppearance.Design.Snackbar.Message"
        android:maxLines="@integer/design_snackbar_text_max_lines"
        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="@dimen/design_snackbar_extra_spacing_horizontal"
        android:layout_marginStart="@dimen/design_snackbar_extra_spacing_horizontal"
        android:layout_gravity="center_vertical|right|end"
        android:minWidth="48dp"
        android:visibility="gone"
        android:textColor="?attr/colorAccent"
        style="?attr/borderlessButtonStyle"/>

</view>

从布局源码我们可以看出以下几点
(1)左边字体样式通过 android:textAppearance="@style/TextAppearance.Design.Snackbar.Message"进行设置
(2)snackbar的样式通过android:theme="@style/ThemeOverlay.AppCompat.Dark"进行控制
所以静态修改字体颜色和大小可以通过在styles文件里面进行

<style name="TextAppearance.Design.Snackbar.Message" parent="android:TextAppearance">
        <item name="android:textSize">16sp</item>
        <item name="android:textColor">#ff0000</item>
</style>