Cómo usar burbujas de notificación para las conversaciones

Las burbujas de notificación facilitan que los usuarios vean las conversaciones y participen en ellas.

Figura 1: Una burbuja de chat.

Flotan sobre el contenido de otras apps, y los usuarios pueden expandirlas para revelar el contenido de la app y, luego, interactuar con él, o bien contraerlas cuando no las usan.

Cuando el dispositivo está bloqueado o la pantalla siempre activa está habilitada, las burbujas aparecen como notificaciones normales.

El usuario habilita las burbujas de notificación. Para ello, deben presionar el botón de burbuja en las notificaciones que admiten burbujas. Esto permite que ese chat específico siempre aparezca en forma de burbuja. En la configuración, los usuarios pueden ajustar qué chats se muestran en burbujas o modificar la configuración de la app en general.

Los usuarios pueden hacer lo siguiente:

  • Bloquea todas las burbujas de notificación de tu app. Las notificaciones no se bloquean, pero nunca aparecen como burbujas.
  • Permite las burbujas de notificación seleccionadas de tu app. Las notificaciones que se muestran en burbujas con el botón de burbuja están "seleccionadas".
  • Permite todas las burbujas de notificación de tu app. Todas las notificaciones que se envían con BubbleMetadata aparecen como burbujas.

La API de burbuja de notificación

Las burbujas de notificación se crean con la API de notificaciones. Si quieres que tu notificación aparezca como una burbuja, adjúntale datos adicionales.

La vista expandida de la burbuja se crea a partir de una actividad que elijas. Configura la actividad para que aparezca correctamente como una burbuja. La actividad debe ser redimensionable y estar incorporada. Si no cumple con alguno de estos requisitos, el sistema lo mostrará como una notificación.

En el siguiente código, se muestra cómo implementar una burbuja:

<activity
  android:name=".bubbles.BubbleActivity"
  android:theme="@style/AppTheme.NoActionBar"
  android:label="@string/title_activity_bubble"
  android:allowEmbedded="true"
  android:resizeableActivity="true"
/>

Si tu app muestra varias burbujas del mismo tipo, como varias conversaciones de chat con diferentes contactos, la actividad debe poder iniciar varias instancias. En los dispositivos que ejecutan Android 10 y versiones anteriores, las notificaciones no se muestran como burbujas, a menos que configures de forma explícita documentLaunchMode como "always". A partir de Android 11, no es necesario que configures este valor de forma explícita, ya que el sistema configura automáticamente el documentLaunchMode de todas las conversaciones como "always".

Para enviar una burbuja de notificación, sigue estos pasos:

  1. Crea una notificación como lo haces normalmente.
  2. Llama a BubbleMetadata.Builder(PendingIntent, Icon) o BubbleMetadata.Builder(String) para crear un objeto BubbleMetadata.
  3. Usa setBubbleMetadata() para agregar los metadatos a la notificación.
  4. Si se orienta a Android 11 (nivel de API 30) o versiones posteriores, asegúrate de que los metadatos de la burbuja o la notificación hagan referencia a un acceso directo de uso compartido.
  5. Modifica tu app para no cancelar las notificaciones que aparecen como burbujas. Si cancelas una notificación, se quitará la burbuja de la pantalla. Cuando se abre una burbuja, se oculta automáticamente la notificación asociada a ella.

Estos pasos se muestran en el siguiente ejemplo:

// Create a bubble intent.
val target = Intent(context, BubbleActivity::class.java)
val bubbleIntent =
    PendingIntent.getActivity(context, 0, target, PendingIntent.FLAG_IMMUTABLE /* flags */)
val category = "com.example.category.IMG_SHARE_TARGET"

val chatPartner = Person.Builder()
    .setName("Chat partner")
    .setImportant(true)
    .build()

// Create a sharing shortcut.
val shortcutId = generateShortcutId()
val shortcut =
    ShortcutInfoCompat.Builder(context, shortcutId)
        .setCategories(setOf(category))
        .setIntent(Intent(Intent.ACTION_DEFAULT))
        .setLongLived(true)
        .setShortLabel("Chat partner name")
        .build()
// Publish the shortcut, otherwise the bubble metadata will not apply.
ShortcutManagerCompat.pushDynamicShortcut(context, shortcut)

// Create a bubble metadata.
val bubbleData = NotificationCompat.BubbleMetadata.Builder(bubbleIntent,
    IconCompat.createWithResource(context, R.drawable.ic_logo))
    .setDesiredHeight(600)
    .build()

// Create a notification, referencing the sharing shortcut.
val builder = NotificationCompat.Builder(context, CHANNEL_ID)
    .setContentIntent(contentIntent)
    .setSmallIcon(R.drawable.chat)
    .setBubbleMetadata(bubbleData)
    .setShortcutId(shortcutId)
    .addPerson(chatPartner)

Si la app está en primer plano cuando se envía una burbuja, se ignora la importancia y siempre se muestra la burbuja, a menos que el usuario bloquee las burbujas o las notificaciones de la app.

Crea una burbuja expandida

Puedes configurar tu burbuja para presentarla en estado expandido automáticamente. Te recomendamos que solo uses esta función si el usuario realiza una acción que genera una burbuja, como presionar un botón para iniciar un chat nuevo. En este caso, también tiene sentido suprimir la notificación inicial que se envía cuando se crea una burbuja.

Existen métodos que puedes usar para establecer marcas que habiliten estos comportamientos: setAutoExpandBubble() y setSuppressNotification().

En el siguiente ejemplo, se muestra cómo configurar una burbuja para que se presente automáticamente en un estado expandido:

val bubbleMetadata = NotificationCompat.BubbleMetadata.Builder()
    .setDesiredHeight(600)
    .setIntent(bubbleIntent)
    .setAutoExpandBubble(true)
    .setSuppressNotification(true)
    .build()

Ciclo de vida del contenido del cuadro

Cuando se expande una burbuja, la actividad de contenido pasa por el ciclo de vida del proceso normal, lo que hace que la aplicación se convierta en un proceso en primer plano, si aún no lo es.

Cuando se contrae o se descarta la burbuja, se destruye la actividad. Esto podría provocar que el proceso se almacene en caché y, luego, se cierre, según si la app tiene otros componentes en primer plano en ejecución.

Cuándo aparecen las burbujas

Para reducir las interrupciones para el usuario, las burbujas solo aparecen en determinadas circunstancias.

Si una app se orienta a Android 11 (nivel de API 30) o versiones posteriores, las notificaciones no aparecen como burbujas, a menos que cumplan con los requisitos de conversación. Si una app se orienta a Android 10 (nivel de API 29) o versiones anteriores, la notificación aparecerá como una burbuja solo si se cumplen una o más de las siguientes condiciones:

Si no se cumple ninguna de estas condiciones, se muestra la notificación en lugar de una burbuja.

Cómo iniciar actividades desde burbujas

Cuando una burbuja inicia una actividad nueva, esta se iniciará en la misma tarea y en la misma ventana de burbuja, o en una tarea nueva en pantalla completa, lo que contraerá la burbuja que la inició.

Para iniciar una actividad nueva en la misma tarea que la burbuja, haz lo siguiente: 1. Usa el contexto de la actividad cuando inicies intents, activity.startActivity(intent) y 1. No establezcas la marca FLAG_ACTIVITY_NEW_TASK en el intent.

De lo contrario, la actividad nueva se inicia en una tarea nueva y se contrae la burbuja.

Ten en cuenta que una burbuja representa una conversación específica, por lo que las actividades que se inicien dentro de ella deben estar relacionadas con esa conversación. Además, iniciar una actividad dentro de la burbuja aumenta la pila de tareas de la burbuja y podría complicar la experiencia del usuario, específicamente en lo que respecta a la navegación.

Prácticas recomendadas

  • Envía una notificación como burbuja solo si es importante, por ejemplo, cuando forma parte de una comunicación en curso o si el usuario solicita explícitamente una burbuja para el contenido. Las burbujas usan espacio de la pantalla y cubren el contenido de otras apps.
  • Asegúrate de que la notificación de burbuja también funcione como una notificación normal. Cuando el usuario inhabilita la burbuja, se muestra una notificación de burbuja como una notificación normal.
  • Usa el elemento componible BackHandler y vincula su parámetro enabled al estado de la IU para que solo intercepte las acciones de volver atrás cuando sea necesario. Una vez que el controlador se inhabilita, la burbuja se contrae.

Cuando una burbuja contraída recibe un mensaje actualizado, muestra un ícono de insignia para indicar que hay un mensaje no leído. Cuando el usuario abra el mensaje en la app asociada, sigue estos pasos:

App de ejemplo

La app de ejemplo SociaLite es una app de conversación que usa burbujas. Para fines de demostración, esta app usa chatbots. En las aplicaciones reales, usa burbujas para los mensajes de humanos.