FloatingActionButton本質(zhì)是一個(gè)ImageButton咳胃，只不過相對于ImageButton旷太，F(xiàn)loatingActionButton多了很多特效而已.
慣例：給出官方文檔.
一、FloatingActionButton實(shí)現(xiàn)的效果圖
使用前添加依賴
dependencies {
compile 'com.android.support:design:25.3.1'
}
布局文件：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.FloatingActionButton
android:id="@+id/floatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/add"
android:layout_centerInParent="true"
app:backgroundTint="@color/colorPrimary"
app:fabSize="normal"
app:borderWidth="0dp"
app:elevation="8dp"
app:pressedTranslationZ="16dp"
app:rippleColor="@color/colorAccent" />
</RelativeLayout>
FloatingActionButton使用及其簡單冻记，直接當(dāng)做ImageButton使用来惧，給它設(shè)置寬高、src等屬性.
下圖是 android:src="@mipmap/add"原圖隅居，是一個(gè)白色的+號.
add.png
觀察上面的效果圖,我們可以發(fā)現(xiàn)FloatingActionButton在add.png的基礎(chǔ)上添加了不少額外的特效:
1)原圖是沒有填充色的葛虐，F(xiàn)loatingActionButton實(shí)現(xiàn)的效果圖上多了藍(lán)色的填充色
2)原圖是沒有陰影的，F(xiàn)loatingActionButton實(shí)現(xiàn)的效果圖上在靜止時(shí)有一個(gè)陰影涕蚤，按下之后陰影范圍擴(kuò)大了
3) 原圖是沒有設(shè)置seletor的的诵，F(xiàn)loatingActionButton實(shí)現(xiàn)的效果圖上在靜止時(shí)是一種填充色，按下之后填充色變了申钩，并且伴隨一個(gè)漣漪擴(kuò)散的動(dòng)畫
二瘪阁、FloatingActionButton的常用屬性
android:src="" FloatingActionButton的圖標(biāo)
app:backgroundTint="" 填充色
該屬性不設(shè)置的話，默認(rèn)使用theme中colorAccent顏色
Android5.0 引入了Z軸的概念管跺，讓組件呈現(xiàn)3D效果豁跑，Z屬性可以通過elevation和translationZ進(jìn)行修改
Z＝ elevation＋translationZ
elevation：設(shè)置該屬性使控件有一個(gè)陰影，感覺該控件像是“浮”起來一樣艇拍，達(dá)到3D效果
translationZ：設(shè)置該組件陰影在Z軸（垂直屏幕方向）上的位移
在5.0之前，我們?nèi)绻虢oView添加陰影效果层释，以體現(xiàn)其層次感快集，通常的做法是給view設(shè)置一個(gè)帶陰影的背景圖片
在5.0之后廉白，我們只需要簡單的修改View的Z屬性乖寒，就能讓其具備陰影的層次感，不過要求版本至少5.0 Lollipop,也就是API21
使用FloatingActionButton的好處就是不需要5.0 就可以使用Z屬性磅轻，因?yàn)間oogle已經(jīng)封裝好了
app:elevation="" 默認(rèn)狀態(tài)下FloatingActionButton的陰影大小
app:pressedTranslationZ="" 按下時(shí)FloatingActionButton的陰影在Z方向（垂直屏幕方向）上的偏移
app:rippleColor="" 按下之后FloatingActionButton的背景顏色马澈，還會伴隨一個(gè)漣漪擴(kuò)散的動(dòng)畫
(PS:需要給FloatingActionButton設(shè)置點(diǎn)擊事件才會有效果)
app:fabSize="" FloatingActionButton的大小弄息，normal,mini,auto三個(gè)值
當(dāng)然，如果這三個(gè)值都不滿意的話涤伐，我們可以直接通過 ：
android:layout_width="" android:layout_height=""
這兩個(gè)我們最常用的屬性來設(shè)置大小
app:borderWidth="0dp" 早期版本如果不設(shè)置這個(gè)屬性為0dp的話缨称，在5.X設(shè)備上沒有陰影效果，不過我測試時(shí)發(fā)現(xiàn)不設(shè)置也沒關(guān)系器净，陰影效果照樣顯示当凡，大概google修復(fù)了吧，如果你的陰影效果不顯示沿量，可以設(shè)置這個(gè)屬性試一試
FloatingActionButton還可以錨定在另外一個(gè)組件上方，這個(gè)通常搭配AppBarLayout权纤，在使用CoordinatorLayoutt作為容器時(shí)才能生效
app:layout_anchor="@id/.......your AppBarLayout id" 錨定哪個(gè)組件乌妒，通常是AppBarLayout
app:layout_anchorGravity="end|bottom" 相對于該組件位置
三、FloatingActionButton兼容性
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.FloatingActionButton
android:id="@+id/floatingActionButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/add"
app:backgroundTint="@color/colorPrimary"
app:fabSize="normal"
app:borderWidth="0dp"
app:elevation="8dp"
app:pressedTranslationZ="16dp"
app:rippleColor="@color/colorAccent" />
</RelativeLayout>
去掉了android:layout_centerInParent="true"
在5.0以前的設(shè)備上的效果圖：
在5.0之后的設(shè)備上的效果圖：
可以看見，兩張效果圖不一樣冗茸，在5.0之前，會默認(rèn)有一個(gè)外邊距形成了margin的效果夏漱，在5.0之后就沒有這個(gè)外邊距，所以我們需要給FloatingActionButton設(shè)置一個(gè)正確的margin來兼容屎篱。
android:layout_margin="@dimen/fab_margin"
在res/values/dimens中
<dimen name="fab_margin">0dp</dimen>
在res/values-v21/dimens中
<dimen name="fab_margin">16dp</dimen>
ok,這樣就能很好的兼容了O(∩_∩)O
PS：在使用CoordinateorLayout作為容器的時(shí)候就沒有外邊距這個(gè)問題了.
四葵蒂、設(shè)置點(diǎn)擊事件
像ImageButton一樣設(shè)置就可以了
public class MainActivity extends AppCompatActivity {
private FloatingActionButton mFAB;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mFAB= (FloatingActionButton) findViewById(R.id.floatingActionButton);
mFAB.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//do something
}
});
}
}
ok，F(xiàn)loatingActionButton的使用就介紹到這里~~~
