Buat notifikasi yang dapat diperluas

Notifikasi dasar biasanya mencakup judul, satu baris teks, dan tindakan yang dapat dilakukan pengguna sebagai respons. Untuk memberikan informasi selengkapnya, Anda dapat membuat notifikasi besar yang dapat diluaskan dengan menerapkan salah satu dari beberapa template notifikasi seperti yang dijelaskan dalam dokumen ini.

Untuk memulai, buat notifikasi dengan semua konten dasar seperti yang dijelaskan dalam Membuat notifikasi. Kemudian, panggil setStyle() dengan objek gaya dan berikan informasi yang sesuai dengan setiap template, seperti yang ditunjukkan dalam contoh berikut.

Menambahkan gambar berukuran besar

Untuk menambahkan gambar dalam notifikasi, teruskan instance NotificationCompat.BigPictureStyle ke setStyle().

var notification =
    NotificationCompat.Builder(context, CHANNEL_ID)
        .setSmallIcon(com.example.compose.snippets.R.drawable.ic_logo)
        .setContentTitle("Title")
        .setContentText("Content text")
        .setStyle(
            NotificationCompat.BigPictureStyle()
                .bigPicture(bitmapImage)
        )
        .build()

Untuk membuat gambar muncul sebagai thumbnail saja saat notifikasi diciutkan, seperti yang ditunjukkan pada gambar berikut, panggil setLargeIcon() dan teruskan gambar tersebut. Kemudian, panggil BigPictureStyle.bigLargeIcon() dan teruskan null sehingga ikon besar akan hilang saat notifikasi diperluas:

notification = NotificationCompat.Builder(context, CHANNEL_ID)
    .setSmallIcon(R.drawable.ic_logo)
    .setContentTitle("Title")
    .setContentText("Content text")
    .setLargeIcon(Icon.createWithResource(context, R.drawable.dog))
    .setStyle(
        NotificationCompat.BigPictureStyle()
            .bigPicture(bitmapImage)
            .bigLargeIcon(null as Bitmap?)
    )
    .build()

Notifikasi yang diciutkan dan notifikasi yang diluaskan yang berisi gambar biru
Gambar 1. Notifikasi menggunakan NotificationCompat.BigPictureStyle.

Menambahkan blok teks besar

Terapkan NotificationCompat.BigTextStyle untuk menampilkan teks di area konten yang diperluas pada notifikasi:

notification = NotificationCompat.Builder(context, CHANNEL_ID)
    .setSmallIcon(R.drawable.ic_logo)
    .setContentTitle("Sender name")
    .setContentText("Email subject")
    .setLargeIcon(Icon.createWithResource(context, R.drawable.dog))
    .setStyle(
        NotificationCompat.BigTextStyle()
            .bigText(someVeryLongMessage)
    )
    .build()

Notifikasi yang diciutkan dan notifikasi yang diluaskan menggunakan BigTextStyle
Gambar 2. Notifikasi menggunakan NotificationCompat.BigTextStyle.

Membuat notifikasi gaya kotak masuk

Terapkan NotificationCompat.InboxStyle ke notifikasi jika Anda ingin menambahkan beberapa baris ringkasan singkat, seperti cuplikan dari email masuk. Dengan begitu, Anda dapat menambahkan beberapa bagian teks konten yang masing-masing dipangkas menjadi satu baris, bukan satu baris teks berkelanjutan yang disediakan oleh NotificationCompat.BigTextStyle.

Untuk menambahkan baris baru, panggil addLine() hingga enam kali, seperti yang ditunjukkan dalam contoh berikut. Jika Anda menambahkan lebih dari enam baris, hanya enam baris pertama yang akan terlihat.

notification = NotificationCompat.Builder(context, CHANNEL_ID)
    .setSmallIcon(R.drawable.mail)
    .setContentTitle("5 New mails from Frank")
    .setContentText("Check them out")
    .setLargeIcon(bitmapImage)
    .setStyle(
        NotificationCompat.InboxStyle()
            .addLine("Re: Planning")
            .addLine("Delivery on its way")
            .addLine("Follow-up")
    )
    .build()

Hasilnya akan terlihat seperti gambar berikut:

Notifikasi gaya kotak masuk yang diperluas
Gambar 3. Notifikasi gaya kotak masuk yang diperluas.

Menampilkan percakapan dalam notifikasi

Terapkan NotificationCompat.MessagingStyle untuk menampilkan pesan berurutan di antara sejumlah orang. Hal ini ideal untuk aplikasi pesan, karena memberikan tata letak yang konsisten untuk setiap pesan dengan menangani nama pengirim dan teks pesan secara terpisah, dan setiap pesan dapat memiliki beberapa baris.

Untuk menambahkan pesan baru, panggil addMessage(), dengan meneruskan teks pesan, waktu diterima, dan nama pengirim. Anda juga dapat meneruskan informasi ini sebagai objek NotificationCompat.MessagingStyle.Message, seperti yang ditunjukkan dalam contoh berikut:

val message1 = NotificationCompat.MessagingStyle.Message(
    messages[0].text,
    messages[0].time,
    messages[0].sender
)
val message2 = NotificationCompat.MessagingStyle.Message(
    messages[1].text,
    messages[1].time,
    messages[1].sender
)
notification = NotificationCompat.Builder(context, CHANNEL_ID)
    .setSmallIcon(R.drawable.ic_logo)
    .setStyle(
        NotificationCompat.MessagingStyle(Person.Builder().setName("Me").build())
            .addMessage(message1)
            .addMessage(message2)
    )
    .build()

Notifikasi dalam gaya pesan
Gambar 4. Notifikasi menggunakan NotificationCompat.MessagingStyle.

Saat menggunakan NotificationCompat.MessagingStyle, semua nilai yang diberikan ke setContentTitle() dan setContentText() akan diabaikan.

Anda dapat memanggil setConversationTitle() untuk menambahkan judul yang muncul di atas percakapan. Nama ini bisa berupa nama grup yang dibuat pengguna atau, jika tidak memiliki nama tertentu, daftar peserta dalam percakapan. Jangan menetapkan judul percakapan untuk chat personal, karena sistem menggunakan keberadaan kolom ini sebagai petunjuk bahwa percakapan adalah grup.

Gaya ini hanya berlaku di perangkat yang menjalankan Android 7.0 (level API 24) dan yang lebih baru. Saat menggunakan library kompatibilitas (NotificationCompat), seperti yang ditunjukkan sebelumnya, notifikasi dengan MessagingStyle akan otomatis di-fallback ke gaya notifikasi yang didukung dan diperluas.

Saat membuat notifikasi seperti ini untuk percakapan chat, tambahkan tindakan balasan langsung.

Membuat notifikasi dengan kontrol media

Terapkan MediaStyleNotificationHelper.MediaStyle untuk menampilkan kontrol pemutaran media dan melacak informasi.

Tentukan MediaSession terkait Anda dalam konstruktor. Hal ini memungkinkan Android menampilkan informasi yang tepat tentang media Anda.

Panggil addAction() hingga lima kali untuk menampilkan hingga lima tombol ikon. Panggil setLargeIcon() untuk menyetel gambar album.

Tidak seperti gaya notifikasi lainnya, MediaStyle juga memungkinkan Anda mengubah tampilan konten berukuran ciut dengan menentukan tiga tombol tindakan yang juga muncul dalam tampilan ciut. Untuk melakukannya, berikan indeks tombol tindakan ke setShowActionsInCompactView().

Contoh berikut menunjukkan cara membuat notifikasi dengan kontrol media:

notification = NotificationCompat.Builder(context, CHANNEL_ID)
    // Show controls on lock screen even when user hides sensitive content.
    .setVisibility(NotificationCompat.VISIBILITY_PUBLIC)
    .setSmallIcon(com.example.compose.snippets.R.drawable.play)
    // Add media control buttons that invoke intents in your media service
    .addAction(R.drawable.previous, "Previous", null /* Add valid intent */) // #0
    .addAction(R.drawable.pause, "Pause", null /* Add valid intent */) // #1
    .addAction(R.drawable.next, "Next", null /* Add valid intent */) // #2
    // Apply the media style template.
    .setStyle(MediaStyleNotificationHelper.MediaStyle(mediaSession)
        .setShowActionsInCompactView(1 /* #1: pause button */))
    .setContentTitle("Wonderful music")
    .setContentText("My Awesome Band")
    .setLargeIcon(bitmapImage)
    .build()

Notifikasi dengan gaya media
Gambar 5. Notifikasi menggunakan MediaStyleNotificationHelper.MediaStyle.

Referensi lainnya

Lihat referensi berikut untuk mengetahui informasi selengkapnya tentang MediaStyle dan notifikasi yang dapat diluaskan.