android 按钮带图标 阴影_FloatingActionButton(悬浮按钮)

FloatingActionButton简称FAB。

一. 对于App或某个页面中是否要使用FloatingActionButton必要性：

FAB代表一个App或一个页面中最主要的操作，如果一个App的每个页面都有FAB,则通常表示该App最主要的功能是通过该FAB操作的。

为了突出FAB的重要性，一个页面最好只有一个FAB。

二. FloatingActionButton大小

通常有两种尺寸

1. 56 * 56dp ：默认的大小，最常用的尺寸。

2. 40 * 40 dp ：Mini版。

当然也可以改它的大小。

FAB中间的图标，google推荐的大小是：24 * 24dp

三. 哪些操作推荐使用FloatingActionButton

如： 添加，收藏，编辑，分享，导航等，如下图：

image.png

而如：删除，警告，错误，剪切等操作，则不推荐使用FloatingActionButton。

四. FAB的使用

Android 5.0 中引入Material Design，FAB为Android Design Support Library支持包中的中Material Design控件，要使用FAB，先要引入Design Support Library包，如在build.gradle中加入：

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

FAB的继承关系：

image.png

FAB常用属性

app:elevation="8dp"：阴影的高度，elevation是Android 5.0中引入的新属性，设置该属性使控件有一个阴影，感觉该

控件像是“浮”起来一样，这样达到3D效果。对应的方法：setCompatElevation(float)

app:fabSize="normal"：FAB的大小，为normal时，大小为：56 * 56dp ，为mini时，大小为： 40 * 40 dp。

app:backgroundTint="#31bfcf"：FAB的背景颜色。

app:rippleColor="#e7d16b"：点击FAB时，形成的波纹颜色。

app:borderWidth="0dp"：边框宽度，通常设置为0 ，用于解决Android 5.X设备上阴影无法正常显示的问题

app:pressedTranslationZ="16dp":点击按钮时，按钮边缘阴影的宽度，通常设置比elevation的数值大!

注意：引用上面属性的时候需要在根节点添加

xmlns:app="http://schemas.android.com/apk/res-auto"

示例：

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:scaleType="fitXY"

android:layout_alignParentBottom="true"

android:layout_alignParentRight="true"

android:layout_margin="16dp"

android:src="@mipmap/fload_add"

app:backgroundTint="@color/deepskyblue"

app:elevation="5dp"

app:pressedTranslationZ="12dp"

app:fabSize="normal"

app:borderWidth="0dp"

app:rippleColor="#cccccc" />

另外我们希望点击按钮一个颜色，正常状态一个颜色 以提高用户体验，那么就是drawable文件夹中创建文件 floatbutton.xml

然后我们设置FloatActionButton的backgroud为这个drawable文件即可，同时app:backgroundTint=""属性也可以不再设置

效果图：

image.png