Membuat dan menampilkan pesan pop-up

Mencoba cara Compose
Jetpack Compose adalah toolkit UI yang direkomendasikan untuk Android. Pelajari cara menambahkan notifikasi di Compose.
Snackbar →

Anda dapat menggunakan Snackbar untuk menampilkan pesan singkat kepada pengguna. Tidak seperti Notifikasi, pesan akan otomatis hilang setelah jangka waktu yang singkat. Snackbar sangat ideal untuk pesan singkat yang tidak memerlukan tindakan dari pengguna. Misalnya, aplikasi email dapat menggunakan Snackbar untuk memberi tahu pengguna bahwa aplikasi berhasil mengirim email.

Menggunakan CoordinatorLayout

Snackbar dilampirkan ke tampilan. Snackbar menyediakan fungsi dasar jika dilampirkan ke objek apa pun yang berasal dari class View, seperti objek tata letak umum. Namun, jika Snackbar dilampirkan ke CoordinatorLayout, Snackbar akan mendapatkan fitur tambahan:

  • Pengguna dapat menutup Snackbar dengan menggesernya.
  • Tata letak memindahkan elemen UI lain saat Snackbar muncul. Misalnya, jika tata letak memiliki FloatingActionButton, tata letak akan memindahkan tombol ke atas saat menampilkan Snackbar, bukan menggambar Snackbar di atas tombol. Anda dapat melihat tampilannya di Gambar 1.

Class CoordinatorLayout menyediakan superset fungsi FrameLayout. Jika aplikasi Anda sudah menggunakan FrameLayout, Anda dapat mengganti tata letak tersebut dengan CoordinatorLayout untuk mengaktifkan fungsi Snackbar sepenuhnya. Jika aplikasi Anda menggunakan objek tata letak lain, gabungkan elemen tata letak yang ada dalam CoordinatorLayout, seperti yang ditunjukkan dalam contoh berikut:

<androidx.coordinatorlayout.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/myCoordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- Here are the existing layout elements, now wrapped in
         a CoordinatorLayout. -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <!-- ...Toolbar, other layouts, other elements... -->

    </LinearLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Tetapkan tag android:id untuk CoordinatorLayout Anda. Anda memerlukan ID tata letak saat menampilkan pesan.

Gambar 1. CoordinatorLayout memindahkan FloatingActionButton ke atas saat Snackbar muncul.

Menampilkan pesan

Ada dua langkah untuk menampilkan pesan. Pertama, buat objek Snackbar dengan teks pesan. Kemudian, Anda memanggil metode show() objek tersebut untuk menampilkan pesan kepada pengguna.

Buat objek Snackbar

Buat objek Snackbar dengan memanggil metode Snackbar.make() statis. Saat Anda membuat Snackbar, tentukan pesan yang ditampilkan dan durasi waktu untuk menampilkan pesan:

val mySnackbar = Snackbar.make(view, stringId, duration)
lihat
Tampilan untuk melampirkan Snackbar. Metode ini menelusuri hierarki tampilan dari tampilan yang diteruskan hingga mencapai CoordinatorLayout atau tampilan konten dekorasi jendela. Biasanya, lebih mudah untuk meneruskan CoordinatorLayout yang melampirkan konten Anda.
stringId
ID resource pesan yang ingin Anda tampilkan. Teks ini dapat diformat atau tidak diformat.
durasi
Durasi waktu untuk menampilkan pesan. Nilainya dapat berupa LENGTH_SHORT atau LENGTH_LONG.

Menampilkan pesan kepada pengguna

Setelah membuat Snackbar, panggil metode show() untuk menampilkan Snackbar kepada pengguna:

mySnackbar.show()

Sistem tidak menampilkan beberapa objek Snackbar pada waktu yang sama, jadi jika tampilan saat ini menampilkan Snackbar lain, sistem akan mengantrekan Snackbar Anda dan menampilkannya setelah Snackbar saat ini berakhir atau ditutup.

Jika Anda ingin menampilkan pesan kepada pengguna dan tidak perlu memanggil metode utilitas objek Snackbar, Anda tidak perlu menyimpan referensi ke Snackbar setelah memanggil show(). Oleh karena itu, penggunaan rangkaian metode untuk membuat dan menampilkan Snackbar dalam satu pernyataan sangat umum dilakukan:

Snackbar.make(
    findViewById(R.id.myCoordinatorLayout),
    R.string.email_sent,
    Snackbar.LENGTH_SHORT
).show()