Aller au contenu

Connecter l'interface utilisateur aux données

Maintenant que vous avez créé la fonction pour remplir la base de données avec l'ensemble initial de mots, l'étape suivante consiste à ajouter le code pour afficher ces mots dans le RecyclerView.

Pour afficher le contenu actuel de la base de données, ajoutez un observateur qui observe les LiveData dans le ViewModel.

Chaque fois que les données changent, la fonction de rappel onChanged() est invoquée. Elle appelle la fonction setWords() de l'adaptateur pour mettre à jour les données mises en cache de l'adaptateur et rafraîchir la liste affichée.

  1. Dans MainActivity, déclarez une propriété pour le ViewModel, avec le délégué by viewModels() :

    MainActivity.kt
    1
    private val wordViewModel: WordViewModel by viewModels()

    Le délégué by viewModels() utilise ViewModelProvider pour associer votre ViewModel à votre activité. Le ViewModel n'est créé qu'au premier accès à la propriété wordViewModel : il n'y a rien d'autre à ajouter dans onCreate().

    Lorsque votre activité est lancée pour la première fois, ViewModelProvider crée le ViewModel. Lorsque l'activité est détruite, par exemple lors d'un changement de configuration, le ViewModel persiste. Lorsque l'activité est recréée, ViewModelProvider renvoie le ViewModel existant. Pour plus d'informations, consultez ViewModel.

    Équivalent sans le délégué

    Voici ce que fait le délégué by viewModels(), écrit explicitement avec ViewModelProvider :

    MainActivity.kt
    1
2
3
4
    private lateinit var wordViewModel: WordViewModel

// Dans onCreate()
wordViewModel = ViewModelProvider(this)[WordViewModel::class.java]

  2. Dans onCreate(), sous le bloc de code RecyclerView, ajoutez un observateur pour le LiveData exposé par allWords. La fonction onChanged() (ici le lambda) est déclenchée lorsque les données observées changent et que l'activité est au premier plan :

    MainActivity.kt
    1
2
3
4
    wordViewModel.allWords.observe(this) { words ->
    // Mettre à jour la copie en cache des mots dans l'adaptateur.
    adapter.setWords(words)
}

  3. Exécutez l'application. L'ensemble initial de mots "Hello" et "World" apparaît dans le RecyclerView.

App with words