Google berkomitmen untuk mendorong terwujudnya keadilan ras bagi komunitas Kulit Hitam. Lihat caranya.

Menambahkan Tombol Tindakan Mengambang

Tombol tindakan mengambang (Floating Action Button/FAB) adalah tombol lingkaran yang memicu tindakan utama di UI aplikasi Anda. Halaman ini menunjukkan cara menambahkan FAB ke tata letak, menyesuaikan sebagian tampilannya, dan merespons ketukan tombol.

Untuk mempelajari lebih lanjut cara mendesain tombol tindakan mengambang ke dalam aplikasi Anda berdasarkan Panduan Desain Material, lihat juga Tombol: Tombol Tindakan Mengambang.

Gambar 1. Tombol tindakan mengambang

Menambahkan tombol tindakan mengambang ke tata letak Anda

Kode berikut menunjukkan tampilan FloatingActionButton dalam file tata letak Anda:

    <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="end|bottom"
            android:src="@drawable/ic_my_icon"
            android:contentDescription="@string/submit"
            android:layout_margin="16dp" />
    

Secara default, FAB diberi warna dengan atribut colorAccent, yang dapat Anda sesuaikan dengan palet warna tema.

Anda dapat mengonfigurasi properti FAB lainnya menggunakan atribut XML atau metode yang sesuai, seperti berikut:

  • Ukuran FAB, menggunakan atribut app:fabSize atau metode setSize().
  • Warna ripple FAB, menggunakan atribut app:rippleColor atau metode setRippleColor().
  • Ikon FAB, menggunakan atribut android:src atau metode setImageDrawable().

Merespons ketukan tombol

Selanjutnya, Anda dapat menerapkan View.OnClickListener untuk menangani ketukan FAB. Misalnya, kode berikut menampilkan Snackbar saat pengguna mengetuk FAB:

Kotlin

    val fab: View = findViewById(R.id.fab)
    fab.setOnClickListener { view ->
        Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
                .setAction("Action", null)
                .show()
    }
    

Java

    FloatingActionButton fab = findViewById(R.id.fab);
    fab.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
                    .setAction("Action", null).show();
        }
    });
    

Untuk informasi selengkapnya tentang kapabilitas FAB, lihat referensi API untuk FloatingActionButton.