Ajouter des fonctionnalités liées au chat à une application Android à l'aide des API Messaging et People

1. Avant de commencer

Créer une application de chat est une tâche difficile. Même si l'expérience utilisateur globale est un ressenti assez subjectif, les API Messaging et People fournies par Android améliorent et simplifient l'expérience de chat.

Dans cet atelier de programmation, vous allez apprendre à utiliser ces API afin de créer un écosystème attrayant pour les applications de chat sur Android. Vous vous appuierez sur JetChat, une application de chat épurée et non fonctionnelle qui utilise Jetpack Compose.

Prérequis

• Connaissances de base sur le développement Android
• Connaissances de base sur les notifications

Objectifs de l'atelier

Créer une appli JetChat étendue qui :

• affiche les notifications représentant les conversations dans la section du panneau des notifications réservée pour les conversations ;
• référence les cibles de partage dans ces notifications, ce qui vous permet de partager du contenu dans les conversations de votre appli ;
• applique les bonnes pratiques pour créer ces objets, ce qui permet de bénéficier des expériences fournies par défaut par le système afin d'améliorer votre application.

Points abordés

• Afficher les notifications liées aux conversations dans la section du panneau des notifications réservée aux conversations
• Comprendre les différentes expériences rendues possibles par les API Messaging et People

Ce dont vous aurez besoin

• Git
• Android Studio
• Un compte GitHub

2. Configuration

L'appli JetChat est notre point de départ. Le code de démarrage étend l'appli JetChat pour mieux présenter les API Messaging et People.

Télécharger le code de démarrage

Pour obtenir le code de démarrage utilisé dans cet atelier de programmation, procédez comme suit :

1. À partir de votre ligne de commande, clonez le dépôt GitHub suivant :

git clone –branch starter-code \
https://github.com/android/people-messaging-codelab.git

2. Ouvrez le projet dans Android Studio, puis sélectionnez Exécuter l'application. Le volet Émulateur apparaît et affiche l'appli.

Explorer l'application JetChat étendue

1. Dans la zone de texte Message #composers de l'appli, saisissez un message et appuyez sur Envoyer.
2. Quittez l'appli. Au bout de quelques secondes, vous recevrez une notification push qui contient la réponse d'une personne participant au chat.

Remarque : La réponse ne provient pas d'une personne réelle. L'appli est programmée pour répondre de façon à simuler une expérience de chat.

3. Créer des notifications de conversation

Android 11 intègre des API permettant d'afficher des notifications de chat dans une section désignée du panneau des notifications, qui est strictement dédiée aux conversations.

La notification doit être de la classe Notification.MessagingStyle et référencer un raccourci de partage de longue durée. Dans cette section, vous allez apprendre à répondre aux exigences de ces API pour afficher ces notifications de conversations dans la section des conversations.

Pour faire en sorte que la classe des notifications soit NotificationCompat.MessagingStyle, procédez comme suit :

1. Dans l'onglet Projet d'Android Studio, cliquez sur app > java > com.example.compose.jetchat > conversation, puis double-cliquez sur ConversationFragment.
2. Dans le fichier ConversationFragment.kt, recherchez la classe ConversationFragment, puis dans la fonction createNotification, recherchez le bloc de code Notification où la notification est créée.
3. Remplacez la méthode setContentText par une méthode setStyle qui définit le style de la notification sur la classe NotificationCompat.MessagingStyle. Cette classe d'assistance ajoute le message qui a été défini avec la méthode setContextText, ainsi qu'un contexte supplémentaire concernant le message, l'heure d'envoi du message et son expéditeur par exemple.

ConversationFragment.kt

private fun createNotification(
   notificationId: Int,
   message: Message,
   person: Person,
   shortcut: ShortcutInfoCompat,
   time: Long
): Notification? {
    ...
    .setStyle(NotificationCompat.MessagingStyle(person).addMessage(
                      NotificationCompat.MessagingStyle.Message(
                          message.content,
                          time,
                          person
                      )
    )
    )
    ...
    .build()
}

Exécuter l'application

1. Exécutez l'application.
2. Dans la zone de texte Message #composers de l'appli, saisissez un message et appuyez sur Envoyer.
3. Quittez l'application. Vous recevez à nouveau une notification push, mais son style est différent. Elle inclut un avatar et un style distinct pour le message. Toutefois, d'autres opérations sont nécessaires pour que vos notifications s'affichent au bon endroit.

4. Créer des cibles de partage pour les conversations

Vous devez référencer un raccourci de partage ou une cible de partage dans la notification. Les cibles de partage sont définies dans le fichier shortcuts.xml. Ce sont les points d'entrée pour gérer des raccourcis définis de façon automatisée. Les raccourcis que vous créez représentent les conversations dans l'appli. Ils vous permettent de partager du contenu dans vos conversations.

Remarque : Vous créez des cibles de partage spécifiques aux messages entrants, qui apparaissent en tant que notifications sur l'appareil de l'utilisateur. Vous devez également créer des cibles de partage pour les messages sortants, mais ce point n'est pas abordé dans cet atelier de programmation. Notez toutefois que les étapes et exemples de code qui s'appliquent aux cibles de partage pour les messages entrants s'appliquent également à celles des messages sortants.

Définir les cibles de partage

1. Dans l'onglet Projet, effectuez un clic droit sur le répertoire res, puis sélectionnez Nouveau > Répertoire.
2. Dans la zone de texte, saisissez xml, puis appuyez sur Enter (ou return sous macOS).
3. Effectuez un clic droit sur le répertoire xml et sélectionnez Fichier.
4. Dans la zone de texte, saisissez shortcuts.xml, puis appuyez sur Enter (ou return sous macOS).
5. Dans le fichier shortcuts.xml, déclarez la cible de partage qui gère le partage des données du type text/plain :

shortcuts.xml

<shortcuts xmlns:android="http://schemas.android.com/apk/res/android">
  <share-target android:targetClass="com.example.compose.jetchat.NavActivity">
   <data android:mimeType="text/plain" />
   <category android:name="com.example.compose.jetchat.share.TEXT_SHARE_TARGET" />
 </share-target>
</shortcuts>

6. Dans l'onglet Projet, cliquez sur manifests, puis double-cliquez sur AndroidManifest.xml.
7. Dans le fichier AndroidManifest.xml, définissez le fichier shortcuts.xml :

AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.compose.jetchat">

   <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/Theme.Jetchat.NoActionBar">
...
 <meta-data android:name="android.app.shortcuts"
            android:resource="@xml/shortcuts" />

    </application>
</manifest>

8. Dans le composant activity du fichier AndroidManifest.xml, définissez le filtre d'intent qui contient la logique de partage :

AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.example.compose.jetchat">

   ...
       <activity
           ...
           <intent-filter>
               <action android:name="android.intent.action.SEND" />
               <category android:name="android.intent.category.DEFAULT" />
               <data android:mimeType="text/plain" />
           </intent-filter>
...

Définir les raccourcis

Vous devez associer le raccourci approprié à chaque notification. Vous définissez un raccourci unique par conversation, car le raccourci unique représente le contact avec lequel partager un contenu.

Pour générer un raccourci, procédez comme suit :

1. Dans l'onglet Projet, cliquez sur app > java > com.example.compose.jetchat > conversation > util, puis double-cliquez sur ConversationUtil.
2. Dans le fichier ConversationUtil.kt, ajoutez une fonction generateShortcut :

ConversationUtil.kt

import android.content.Intent
import androidx.core.content.pm.ShortcutInfoCompat
import com.example.compose.jetchat.NavActivity

class ConversationUtil {

   companion object {
...
fun generateShortcut(context: Context, shortcutId: String): ShortcutInfoCompat {
   return ShortcutInfoCompat.Builder(context, shortcutId)
   .setCategories(setOf(CATEGORY_SHARE))
   .setLongLived(true)
   .setShortLabel(shortcutId)
   .setLongLabel(shortcutId)
   .setIntent(
       Intent(context, NavActivity::class.java)
           .setAction(Intent.ACTION_VIEW)
   )
   .build()
}

Cette fonction contient les méthodes setPerson et setLongLived requises pour la conversation. La personne est le contact associé au raccourci. Lorsque vous définissez la "longue durée" sur la valeur true, ce raccourci est mis en cache par le système et il apparaît dans différentes surfaces de l'interface utilisateur.

Référencer le raccourci dans la notification

Remarque : Les cibles de partage publiées pour les messages sortants ne sont liées à aucune notification, car les messages sortants ne génèrent généralement pas de notification pour l'utilisateur qui envoie le message.

Vous devez référencer le raccourci de partage dans la notification. Il faut toutefois créer le raccourci avant de transférer la notification.

Pour cela, procédez comme suit :

1. Dans le fichier ConversationFragment.kt, recherchez la classe ConversationFragment.
2. Avant d'appeler la variable notification, créez une variable shortcut qui référence le raccourci généré à partir de ConversationUtil.generateShortcut.
3. Dans la méthode createNotification de la variable notification, remplacez null en utilisant la variable shortcut comme paramètre.

ConversationFragment.kt

private fun simulateResponseAsANotification() {
   ...
   if (message.author != "me") {
       ...
       val shortcut = ConversationUtil.generateShortcut(context!!, message.author)
       val notification = createNotification(notificationId, message, person, shortcut, time)
       ...
   }
}

4. Dans la méthode createNotification, ajoutez la méthode NotificationCompat.Builder#setShortcutInfo, puis transmettez la variable shortcut comme paramètre.

ConversationFragment.kt

private fun createNotification(
  notificatoinIf: Int,
  messagin: Message,
  person: Person,
  shortcut: ShortcutInfoCompat?,
  time: Long
): Notification {
...
return NotificationCompat.Builder(context!!,  ConversationUtil.CHANNEL_MESSAGES)
   ...
   .setShortcutInfo(shortcut)
   .build()
}

Remarque : La méthode NotificationCompat.Builder#setShortcutInfo définit également la classe LocusId sur le raccourci, ce qui est vivement recommandé. Si vous annotez ensuite l'activité associée avec la classe LocusId, vous envoyez des signaux à l'intelligence embarquée pour indiquer que le raccourci est associé à cette conversation. Ces signaux sont utilisés pour classer la conversation en conséquence. Vous êtes ainsi sûr d'afficher cette conversation correctement en fonction de l'activité de l'utilisateur. Pour en savoir plus, consultez la section Bonnes pratiques.

Remarque : Les cibles de partage ne sont pas particulières aux conversations. Vous pouvez les retrouver en-dehors des conversations. Pour en savoir plus sur les cibles de partage, consultez API de raccourci de partage.

Publier le raccourci

• Pour publier le raccourci, dans la fonction simulateResponseAsANotification avant la méthode notificationManager.notify, appelez la méthode pushDynamicShortcut :

ConversationFragment.kt

import androidx.core.content.pm.ShortcutManagerCompat

...private fun simulateResponseAsANotification() {
   ...
   if (message.author != "me") {
       ...
       ShortcutManagerCompat.pushDynamicShortcut(context!!, shortcut)
       ...
   }
}

Remarque : Vous pouvez publier un raccourci de différentes façons, mais la méthode pushDynamicShortcut utilise l'API reportShorcutUsed, ce qui indique à l'intelligence embarquée qu'il s'agit d'un contact avec lequel partager du contenu. La méthode pushDynamicShortcut assure également que les raccourcis sont mis à jour sans qu'il soit nécessaire de gérer le nombre maximal de raccourcis.

Remarque : Un appui prolongé sur une notification MessagingStyle sans raccourci référencé permet de mettre en évidence le fait qu'elle ne prend pas en charge les fonctionnalités de conversation. Avec un raccourci référencé, vous pouvez définir la priorité et les paramètres de cette notification. Pour en savoir plus, consultez Test des raccourcis et des notifications de conversation.

Exécuter l'application

1. Exécutez l'application.
2. Dans la zone de texte Message #composers de l'appli, saisissez un message et appuyez sur Envoyer.
3. Quittez l'application. Vous recevez à nouveau une notification push, mais comme il s'agit d'une notification liée à une conversation, son style est plus marqué. L'icône de l'avatar est plus prononcée et comporte l'icône de l'appli. L'expéditeur, l'heure et le texte sont également présentés de manière optimisée.

5. Facultatif : Activer les bulles

Les bulles ont été introduites dans Android 9, puis améliorées et réorientées pour une utilisation dans le contexte des conversations dans Android 11. Les bulles sont des superpositions circulaires qui constituent les avatars de vos conversations. Elles apparaissent dans le lanceur d'applications et vous permettent de répondre facilement aux conversations dans une bulle développée. Même lorsqu'elles sont implémentées, les bulles sont facultatives, et les utilisateurs peuvent choisir de les activer ou non.

Pour activer les bulles, procédez comme suit :

1. Dans le fichier AndroidManifest.xml, ajoutez les attributs allowEmbedded et resizeableActivity, puis définissez-les sur la valeur true :

AndroidManifest.xml

<activity
  ...
  android:allowEmbedded="true"
  android:resizeableActivity="true"
  ...
</activity>

2. Dans le fichier ConversationUtil.kt, ajoutez les métadonnées de bulle dans la classe ConversationUtil :

ConversationUtil.kt

import androidx.core.app.NotificationCompat
import androidx.core.graphics.drawable.IconCompat

fun createBubbleMetadata(context: Context, icon: IconCompat): NotificationCompat.BubbleMetadata {
        // Create bubble intent
        val target = Intent(context, NavActivity::class.java)
        val bubbleIntent = PendingIntent.getActivity(context, REQUEST_BUBBLE, target, flagUpdateCurrent(mutable = true))

        // Create bubble metadata
        return NotificationCompat.BubbleMetadata.Builder(bubbleIntent, icon)
            .setDesiredHeight(400)
            .setSuppressNotification(true)
            .build()
    }

3. Dans le fichier ConversationFragment.kt, créez et référencez les métadonnées de bulle sur la notification :

ConversationFragment.kt

private fun createNotification(
  notificatoinIf: Int,
  messagin: Message,
  person: Person,
  shortcut: ShortcutInfoCompat?,
  time: Long
): Notification {
...
// Reference the bubble metadata in the notification.
  return NotificationCompat.Builder(context!!,     ConversationUtil.CHANNEL_MESSAGES)
    ...
     .setBubbleMetadata(ConversationUtil.createBubbleMetadata(context!!, person.icon!!))
...
    .build()
}

Exécuter l'application

1. Exécutez l'application.
2. Dans la zone de texte Message #composers de l'appli, saisissez un message et appuyez sur Envoyer.
3. Quittez l'appli. Au bout de quelques secondes, vous recevez une notification provenant du chat, sous forme de bulle.
4. Appuyez sur la bulle. La conversation s'ouvre dans la bulle.

6. Facultatif : Partager un lien

Vous avez déclaré les cibles de partage et vous les avez référencées dans vos notifications, ce qui a également activé l'affichage de votre contact dans la Sharesheet, un composant ascendant qui apparaît lorsque l'intent ACTION est envoyé. Les cibles de partage sont affichées dans la partie supérieure de la Sharesheet et vous permettent de partager du contenu enrichi dans vos conversations.

Pour appeler la Sharesheet, procédez comme suit :

1. Sur votre appareil, ouvrez Google Chrome, puis accédez à une page Web, par exemple developer.android.com.
2. Le cas échéant, cliquez sur Autres options.
3. Cliquez sur Partager. La Sharesheet apparaît au bas de l'écran.

4. Si possible, cliquez sur JetChat. L'URL est partagée dans le chat.
5. Si vous ne voyez pas JetChat, cliquez sur Plus pour appeler la Sharesheet système, puis balayez l'écran vers le haut sur la ShareSheet et cliquez sur JetChat. L'URL est partagée dans le chat.

Il s'agit d'un exemple simple. Vous pouvez partager des types de contenu plus riche. Pour en savoir plus, consultez Récupération de données simples à partir d'autres apps.

7. Félicitations

Félicitations ! Vous savez maintenant comment ajouter des fonctionnalités de chat à une application Android grâce aux API Messaging et People. Profitez bien des fonctionnalités de chat !

En savoir plus

• Compatibilité avec les emoji
• Recevoir du contenu enrichi
• Classe PeopleManager
• Personnes et conversations