Jadi di build.gradle
file Anda , tambahkan ini:
compile 'com.android.support:design:27.1.1'
AndroidX Catatan: Google sedang memperkenalkan perpustakaan ekstensi AndroidX baru untuk menggantikan Perpustakaan Dukungan yang lebih lama. Untuk menggunakan AndroidX, pertama-tama pastikan Anda telah memperbarui gradle.properties
file Anda , diedit build.gradle
untuk mengatur compileSdkVersion
ke 28
(atau lebih tinggi), dan menggunakan baris berikut alih-alih yang sebelumnya compile
.
implementation 'com.google.android.material:material:1.0.0'
Selanjutnya, di themes.xml
atau styles.xml
atau apa pun Anda, pastikan Anda mengatur ini- itu adalah warna aksen aplikasi Anda - dan warna FAB Anda kecuali Anda menimpanya (lihat di bawah):
<item name="colorAccent">@color/floating_action_button_color</item>
Dalam XML tata letak:
<RelativeLayout
...
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.design.widget.FloatingActionButton
android:id="@+id/myFAB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_plus_sign"
app:elevation="4dp"
... />
</RelativeLayout>
Atau jika Anda menggunakan pustaka materi AndroidX di atas, Anda sebaiknya menggunakan ini:
<RelativeLayout
...
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/myFAB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:srcCompat="@drawable/ic_plus_sign"
app:elevation="4dp"
... />
</RelativeLayout>
Anda dapat melihat lebih banyak opsi dalam dokumen (dokumen materi di sini) ( setRippleColor
, dll.), Tetapi salah satu catatan adalah:
app:fabSize="mini"
Satu lagi yang menarik - untuk mengubah warna latar belakang hanya satu FAB, tambahkan:
app:backgroundTint="#FF0000"
(misalnya untuk mengubahnya menjadi merah) ke XML di atas.
Lagi pula, dalam kode, setelah tampilan Aktivitas / Fragmen meningkat ....
FloatingActionButton myFab = (FloatingActionButton) myView.findViewById(R.id.myFAB);
myFab.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
doMyThing();
}
});
Pengamatan:
- Jika Anda memiliki salah satu tombol yang berada di "jahitan" yang memisahkan dua tampilan (menggunakan RelativeLayout, misalnya) dengan, katakanlah, margin tata letak bawah negatif untuk tumpang tindih perbatasan, Anda akan melihat masalah: ukuran FAB sebenarnya sangat berbeda pada lollipop vs pre-lollipop. Anda benar-benar dapat melihat ini di editor tata letak visual AS ketika Anda beralih di antara API - tiba-tiba "puffs" ketika Anda beralih ke pra-lollipop. Alasan untuk ukuran ekstra tampaknya karena bayangan memperluas ukuran tampilan di setiap arah. Jadi, Anda harus memperhitungkan ini ketika Anda menyesuaikan margin FAB jika dekat dengan hal-hal lain.
Berikut cara untuk menghapus atau mengganti bantalan jika ada terlalu banyak:
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
RelativeLayout.LayoutParams p = (RelativeLayout.LayoutParams) myFab.getLayoutParams();
p.setMargins(0, 0, 0, 0); // get rid of margins since shadow area is now the margin
myFab.setLayoutParams(p);
}
Juga, saya akan secara program menempatkan FAB pada "jahitan" antara dua area dalam RelativeLayout dengan meraih ketinggian FAB, membaginya dengan dua, dan menggunakannya sebagai margin offset. Tapi myFab.getHeight () mengembalikan nol, bahkan setelah tampilan meningkat, sepertinya. Alih-alih, saya menggunakan ViewTreeObserver untuk mendapatkan ketinggian hanya setelah diletakkan dan kemudian mengatur posisi. Lihat tip ini di
sini . Itu terlihat seperti ini:
ViewTreeObserver viewTreeObserver = closeButton.getViewTreeObserver();
if (viewTreeObserver.isAlive()) {
viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
closeButton.getViewTreeObserver().removeGlobalOnLayoutListener(this);
} else {
closeButton.getViewTreeObserver().removeOnGlobalLayoutListener(this);
}
// not sure the above is equivalent, but that's beside the point for this example...
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) closeButton.getLayoutParams();
params.setMargins(0, 0, 16, -closeButton.getHeight() / 2); // (int left, int top, int right, int bottom)
closeButton.setLayoutParams(params);
}
});
}
Tidak yakin apakah ini cara yang tepat untuk melakukannya, tetapi tampaknya berhasil.
- Tampaknya Anda dapat membuat ruang bayangan tombol lebih kecil dengan mengurangi ketinggian.
Jika Anda ingin FAB pada "jahitan" yang dapat Anda gunakan layout_anchor
dan layout_anchorGravity
berikut adalah contohnya:
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="bottom|right|end"
android:src="@drawable/ic_discuss"
android:layout_margin="@dimen/fab_margin"
android:clickable="true"/>
Ingatlah bahwa Anda dapat secara otomatis memiliki tombol yang melompat ketika Snackbar muncul dengan membungkusnya di CoordinatorLayout .
Lebih: