Material Design学习之FloatingActionButton（FAB）

FloatingActionButton是继承至ImageView，所以FloatingActionButton拥有ImageView的所有属性。

FloatingActionButton属性的学习 :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context=".MainActivity">

    <!--可以预防悬浮按钮被挡住(与Snackbar同用时)-->
    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/btnFloatingAction"     //控件id
            android:layout_width="wrap_content"    //宽与高
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"   //底部|右边
            android:src="@mipmap/ic_launcher"    //设置FAB的图标
            app:rippleColor="@color/colorPrimaryDark" // 设置点击时的背景颜色

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

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

            app:pressedTranslationZ="12dp"  //点击时候FAB的阴影大小。

            app:elevation="12dp"  //默认状态下FAB的阴影大小

            app:backgroundTintMode="screen"  // 设置FAB的背景模式。

            app:backgroundTint="@color/colorPrimaryDark"  //设置FAB的背景颜色。

            app:layout_anchor="@id/layout"  //设置FAB的锚点，即以哪个控件为参照点设置位置。

            app:layout_anchorGravity="bottom|right"  //设置FAB相对锚点的位置，值有 bottom、center、right、left、top等。
            />
    </android.support.design.widget.CoordinatorLayout>
</RelativeLayout>

代码运行

import android.app.Activity;
import android.os.Bundle;
import android.support.design.widget.Snackbar;
import android.view.View;
import android.view.ViewGroup;

/**
 * Material Design学习之
 * Snackbar的使用方式
 */
public class MainActivity extends Activity {

    private ViewGroup layout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        layout = (ViewGroup) this.findViewById(R.id.layout);
        layout.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
            //Snackbar与悬浮按钮一起使用时，预约FAB被遮挡--父控件
                Snackbar.make(layout, "Snackbar的使用 ", Snackbar.LENGTH_LONG).setAction("点击退出APP", new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        finish();
                    }
                }).show();

            }
        });
    }

}

效果如下