Cómo crear una notificación expandible

Una notificación básica generalmente incluye un título, una línea de texto y una o varias acciones que el usuario puede realizar como respuesta. A fin de proporcionar información adicional, también puedes crear notificaciones grandes y expandibles mediante una de las tantas plantillas de notificaciones, como se describe en esta página.

Para comenzar, crea una notificación con todo el contenido básico, según se describe en Cómo crear una notificación. Luego, llama a setStyle() con un objeto de estilo y proporciona la información correspondiente a cada plantilla, como se muestra debajo.

Cómo agregar una imagen grande

Para agregar una imagen en la notificación, pasa una instancia de NotificationCompat.BigPictureStyle a setStyle().

Kotlin

    var notification = NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_post)
            .setContentTitle(imageTitle)
            .setContentText(imageDescription)
            .setStyle(NotificationCompat.BigPictureStyle()
                    .bigPicture(myBitmap))
            .build()
    

Java

    Notification notification = new NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_post)
            .setContentTitle(imageTitle)
            .setContentText(imageDescription)
            .setStyle(new NotificationCompat.BigPictureStyle()
                   .bigPicture(myBitmap))
            .build();
    

Si quieres que la imagen aparezca como una miniatura solo cuando se contrae la notificación (como se muestra en la figura 1), llama a setLargeIcon() y pásale la imagen. Además, deberás llamar a BigPictureStyle.bigLargeIcon() y pasarle el valor null a fin de que el ícono grande desaparezca cuando se expanda la notificación:

Kotlin

    var notification = NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_post)
            .setContentTitle(imageTitle)
            .setContentText(imageDescription)
            .setLargeIcon(myBitmap)
            .setStyle(NotificationCompat.BigPictureStyle()
                    .bigPicture(myBitmap)
                    .bigLargeIcon(null))
            .build()
    

Java

    Notification notification = new NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_post)
            .setContentTitle(imageTitle)
            .setContentText(imageDescription)
            .setLargeIcon(myBitmap)
            .setStyle(new NotificationCompat.BigPictureStyle()
                    .bigPicture(myBitmap)
                    .bigLargeIcon(null))
            .build();
    

Figura 1: Notificación que usa NotificationCompat.BigPictureStyle

Cómo agregar un bloque de texto grande

Aplica NotificationCompat.BigTextStyle para mostrar texto en el área de contenido expandido de la notificación:

Kotlin

    var notification = NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_mail)
            .setContentTitle(emailObject.getSenderName())
            .setContentText(emailObject.getSubject())
            .setLargeIcon(emailObject.getSenderAvatar())
            .setStyle(NotificationCompat.BigTextStyle()
                    .bigText(emailObject.getSubjectAndSnippet()))
            .build()
    

Java

    Notification notification = new NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_mail)
            .setContentTitle(emailObject.getSenderName())
            .setContentText(emailObject.getSubject())
            .setLargeIcon(emailObject.getSenderAvatar())
            .setStyle(new NotificationCompat.BigTextStyle()
                    .bigText(emailObject.getSubjectAndSnippet()))
            .build();
    

Figura 2: Notificación que usa NotificationCompat.BigTextStyle

Sugerencia: Para agregar formato al texto (negrita, cursiva, saltos de línea, etc.), puedes agregar estilo con el lenguaje de marcado HTML.

Cómo crear una notificación con estilo de bandeja de entrada

Aplica NotificationCompat.InboxStyle a una notificación si quieres agregar varias líneas de resumen breve, como fragmentos de correos electrónicos entrantes. De esta manera, puedes agregar varias porciones del texto de contenido. Cada una se truncará en una línea, en lugar de mostrarse en una línea continua de texto que proporciona NotificationCompat.BigTextStyle.

Si quieres agregar una nueva línea, puedes llamar a addLine() hasta 6 veces. Si agregas más de 6 líneas, solo se verán las primeras 6.

Kotlin

    var notification = NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_mail)
            .setContentTitle("5 New mails from " + sender.toString())
            .setContentText(subject)
            .setLargeIcon(aBitmap)
            .setStyle(NotificationCompat.InboxStyle()
                    .addLine(messageSnippet1)
                    .addLine(messageSnippet2))
            .build()
    

Java

    Notification notification = new NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_mail)
            .setContentTitle("5 New mails from " + sender.toString())
            .setContentText(subject)
            .setLargeIcon(aBitmap)
            .setStyle(new NotificationCompat.InboxStyle()
                    .addLine(messageSnippet1)
                    .addLine(messageSnippet2))
            .build();
    

Sugerencia: Puedes diferenciar el asunto del mensaje y el mensaje en cada línea agregando estilo con lenguaje de marcado HTML (como poner el asunto en negrita).

Cómo mostrar una conversación en una notificación

Aplica NotificationCompat.MessagingStyle a fin de mostrar mensajes secuenciales entre cualquier cantidad de personas. Esta opción es ideal para las apps de mensajes, ya que proporciona un diseño coherente a cada mensaje mediante la administración del nombre del remitente y el texto del mensaje por separado, y cada mensaje puede tener varias líneas.

Para agregar un mensaje nuevo, llama a addMessage() y pasa el texto del mensaje, la hora de recepción y el nombre del remitente. También puedes pasar esta información como un objeto NotificationCompat.MessagingStyle.Message.

Kotlin

    var message1 = NotificationCompat.MessagingStyle.Message(messages[0].getText(),
            messages[0].getTime(),
            messages[0].getSender())
    var message2 = NotificationCompat.MessagingStyle.Message(messages[1].getText(),
            messages[1].getTime(),
            messages[1].getSender())
    var notification = NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_message)
            .setStyle(NotificationCompat.MessagingStyle(resources.getString(R.string.reply_name))
                    .addMessage(message1)
                    .addMessage(message2))
            .build()
    

Java

    NotificationCompat.MessagingStyle.Message message1 =
            new NotificationCompat.MessagingStyle.Message(messages[0].getText(),
                                                          messages[0].getTime(),
                                                          messages[0].getSender());
    NotificationCompat.MessagingStyle.Message message2 =
            new NotificationCompat.MessagingStyle.Message(messages[1].getText(),
                                                          messages[1].getTime(),
                                                          messages[1].getSender());

    Notification notification = new NotificationCompat.Builder(context, CHANNEL_ID)
            .setSmallIcon(R.drawable.new_message)
            .setStyle(new NotificationCompat.MessagingStyle(resources.getString(R.string.reply_name))
                    .addMessage(message1)
                    .addMessage(message2))
            .build();
    

Figura 3: Notificación que usa NotificationCompat.MessagingStyle

De manera opcional, puedes llamar a setConversationTitle() a fin de agregar un título que aparezca encima de la conversación. Este puede ser el nombre del grupo creado por el usuario o, si no tiene un nombre específico, una lista de los participantes de la conversación. No establezcas un título de conversación para chats entre dos personas, porque el sistema usa los datos de este campo para indicar que la conversación es un grupo.

Se aplica este estilo únicamente a dispositivos que ejecutan Android 7.0 (API nivel 24) y versiones posteriores. Cuando se usa la biblioteca de compatibilidad (NotificationCompat) como se mostró más arriba, las notificaciones con MessagingStyle adoptan automáticamente un estilo de notificación expandida compatible.

Cuando se crea una notificación como esta para una conversación de chat, también deberías agregar una acción de respuesta directa.

Cómo crear una notificación con controles de contenido multimedia

Aplica NotificationCompat.MediaStyle para mostrar los controles de reproducción de contenido multimedia y la información de la pista.

Puedes llamar a addAction() hasta cinco veces para mostrar cinco botones de íconos individuales. Y también a setLargeIcon() a fin de configurar el material gráfico del álbum.

A diferencia de los otros estilos de notificaciones, MediaStyle también te permite modificar la vista de contenido de tamaño contraído mediante la especificación de tres botones de acción que también deberían aparecer en la vista contraída. Para hacerlo, proporciona los índices de botones de acciones a setShowActionsInCompactView().

Si la notificación representa una sesión multimedia activa, también deberás adjuntar un MediaSession.Token a la notificación mediante setMediaSession(). En consecuencia, Android la identificará como una notificación que representa una sesión multimedia activa y responderá de manera apropiada (por ejemplo, mostrará el material gráfico del álbum en la pantalla de bloqueo).

Kotlin

    import android.support.v4.app.NotificationCompat
    import android.support.v4.media.app.NotificationCompat as MediaNotificationCompat

    var notification = NotificationCompat.Builder(context, CHANNEL_ID)
            // Show controls on lock screen even when user hides sensitive content.
            .setVisibility(NotificationCompat.VISIBILITY_PUBLIC)
            .setSmallIcon(R.drawable.ic_stat_player)
            // Add media control buttons that invoke intents in your media service
            .addAction(R.drawable.ic_prev, "Previous", prevPendingIntent) // #0
            .addAction(R.drawable.ic_pause, "Pause", pausePendingIntent) // #1
            .addAction(R.drawable.ic_next, "Next", nextPendingIntent) // #2
            // Apply the media style template
            .setStyle(MediaNotificationCompat.MediaStyle()
                    .setShowActionsInCompactView(1 /* #1: pause button \*/)
                    .setMediaSession(mediaSession.getSessionToken()))
            .setContentTitle("Wonderful music")
            .setContentText("My Awesome Band")
            .setLargeIcon(albumArtBitmap)
            .build()
    

Java

    Notification notification = new NotificationCompat.Builder(context, CHANNEL_ID)
            // Show controls on lock screen even when user hides sensitive content.
            .setVisibility(NotificationCompat.VISIBILITY_PUBLIC)
            .setSmallIcon(R.drawable.ic_stat_player)
            // Add media control buttons that invoke intents in your media service
            .addAction(R.drawable.ic_prev, "Previous", prevPendingIntent) // #0
            .addAction(R.drawable.ic_pause, "Pause", pausePendingIntent)  // #1
            .addAction(R.drawable.ic_next, "Next", nextPendingIntent)     // #2
            // Apply the media style template
            .setStyle(new android.support.v4.media.app.Notification.MediaStyle()
                    .setShowActionsInCompactView(1 /* #1: pause button */)
                    .setMediaSession(mediaSession.getSessionToken()))
            .setContentTitle("Wonderful music")
            .setContentText("My Awesome Band")
            .setLargeIcon(albumArtBitmap)
            .build();
    

Figura 4: Notificación que usa NotificationCompat.MediaStyle

Para obtener más información, también puedes leer Cómo usar notificaciones MediaStyle con un servicio en primer plano. Para ver un código de ejemplo que usa notificaciones, consulta Ejemplo de notificaciones de Android.