Material Design Library系列之FloatingActionButton与Snackbar

            前言：不知道为啥Material Design出来这么久也没见多少国产APP上使用该设计，知乎上曾经有一个版本使用了NavigationView，过了没多久下一版就改掉了......

        对于Material Design以前也只是大概了解有哪些控件，哪里可以用，浅尝辄止，到了用的时候再具体找资料运用，现在在这里做个笔记，好好记录一下。

        先从最简单的两个控件开始：

一、FloatingActionButton

       FloatingActionButton的使用非常简单，它继承自ImageView，只不过特殊的是它是悬浮于底层布局之上的，可以认为是对手机垂直方向的一个延伸布局。

       接下来实现的效果是这样的：

       

       1.新建一个Android Studio工程，在dependencies下添加依赖：

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

       2.在activity_mail.xml下加入以下代码：

<android.support.design.widget.FloatingActionButton
        android:id="@+id/id_fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@android:drawable/ic_dialog_email"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true"/>

这里只是简单地使用系统自带源图片填充，然后将位置设定为右下角。

       3.在MainActivity.java下加入如下代码：

findViewById(R.id.id_fab).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(getApplicationContext(), "你点击了信息", Toast.LENGTH_SHORT).show();
            }
        });

给控件添加点击事件监听器，点击后弹出一个Toast。

补充说明：

       FloatingActionButton还有这些属性可以设置：

       app:backgroundTint - 设置FAB的背景颜色。

       app:rippleColor - 设置FAB点击时的背景颜色。

       app:borderWidth - 该属性尤为重要，如果不设置0dp，那么在4.1的sdk上FAB会显示为正方形，而且在5.0以后的sdk没有阴影效果。所以设置为borderWidth="0dp"。

       app:elevation - 默认状态下FAB的阴影大小。

       app:pressedTranslationZ - 点击时候FAB的阴影大小。

       app:fabSize - 设置FAB的大小，该属性有两个值，分别为normal和mini，对应的FAB大小分别为56dp和40dp。

       src - 设置FAB的图标，Google建议符合Design设计的该图标大小为24dp。

       app:layout_anchor - 设置FAB的锚点，即以哪个控件为参照点设置位置。

       app:layout_anchorGravity - 设置FAB相对锚点的位置，值有 bottom、center、right、left、top等。

源码地址：http://download.csdn.net/detail/chenhao0428/9547254

/**--------------------------------------分割线---------------------------------------*/

二、Snackbar

       和Toast类似，但是它多了个可选择的单个的Action，所以也可以替代Dialog使用，交互效果更好。同时还有个特性就是用户可以在它消失时间未到时，通过滑动移除它！但该特性只有在与CoordinatorLayout一起使用时才生效！

       接下来实现的效果是这样的：

       

       1.新建工程并添加依赖。

       2.在activity_main.xml下添加如下代码：

<!-- 使用该TextView作为snackbar的父控件 -->
    <TextView
        android:id="@+id/id_tv"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/id_fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

由于snackbar的make()方法的第一个参数需要传入View，这里使用TextView作为父布局。FloatingActionButton用来点击弹出Snackbar。

       3.在MainActivity.java下加入如下代码：

findViewById(R.id.id_fab).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Snackbar.make(textView, "点击了FAB", Snackbar.LENGTH_SHORT)
                        .setAction("Dismiss", null)
                        .show();
            }
        });

这里只是简单地代替Toast弹出提醒，当需要交互Action时将setAction()的第二个参数设置成按键监听。

补充说明：

       当父布局使用CoordinatorLayout时，可以被滑动手势划走

       Snackbar的一些方法：

       make() => 创建 Snackbar

       setAction() => 对Snackbar设置单击事件

       setDuration() => 设置Snackbar显示时长

       getDuration() => 得到显示时长

       setActionTextColor() => 设置Action颜色

       setText() => 更新Snackbar中的文本

       show() => 显示Snackbar

       dismiss() => 消失Snackbar

源码地址：http://download.csdn.net/detail/chenhao0428/9547252