Aller au contenu

Tâche 4 : Afficher les données dans le RecyclerView

Vous avez maintenant une base de données, avec des données. Ensuite, vous mettrez à jour WordListAdapter et MainActivity pour récupérer et afficher ces données.

Rappel : Architecture du RecyclerView

Le RecyclerView est un composant Android qui permet d'afficher efficacement de grandes listes de données. Il fonctionne selon le principe de recyclage des vues pour optimiser les performances.

Composants principaux

graph TB
    A[RecyclerView] --> B[LayoutManager]
    A --> C[Adapter]
    A --> D[ViewHolder]

    B --> B1[LinearLayoutManager]
    B --> B2[GridLayoutManager]
    B --> B3[StaggeredGridLayoutManager]

    C --> C1[Gère les données]
    C --> C2[Crée les ViewHolders]
    C --> C3[Lie les données aux vues]

    D --> D1[Cache les références des vues]
    D --> D2[Améliore les performances]

    style A fill:#4CAF50,stroke:#2E7D32,color:#fff
    style C fill:#2196F3,stroke:#1565C0,color:#fff
    style D fill:#FF9800,stroke:#E65100,color:#fff
    style B fill:#9C27B0,stroke:#6A1B9A,color:#fff

Rôle de chaque composant

  • RecyclerView : Le conteneur principal qui affiche la liste
  • LayoutManager : Détermine comment les éléments sont disposés (liste, grille, etc.)
  • Adapter : Fait le pont entre les données et les vues
  • ViewHolder : Contient les références aux vues d'un élément pour éviter les appels répétés à findViewById()

Flux de données

  1. L'Adapter récupère les données (dans notre cas, depuis la base de données)
  2. Le ViewHolder conserve les références aux vues de chaque élément
  3. La méthode onBindViewHolder() lie les données aux vues
  4. Le RecyclerView réutilise les ViewHolder existants lors du défilement

1. Mettre à jour WordListAdapter pour afficher les WordItems

  1. Ouvrez WordListAdapter.
  2. Dans onBindViewHolder, remplacez le code qui affiche les données fictives par du code permettant d'obtenir un élément de la base de données et de l'afficher. Vous remarquerez une erreur sur mDB.

    WordItem current = mDB.query(position); 
    holder.wordItemView.setText(current.getWord()); 
    
  3. Déclarez mDB comme variable d'instance.

    WordListOpenHelper mDB; 
    
  4. Pour obtenir la valeur de mDB, modifiez le constructeur de WordListAdapter et ajoutez un deuxième paramètre pour WordListOpenHelper.

  5. Affectez la valeur du paramètre à mDB. Votre constructeur devrait ressembler à ceci :

    1
    2
    3
    4
    5
    public WordListAdapter(Context context, WordListOpenHelper db) {
            mInflater = LayoutInflater.from(context); 
            mContext = context; 
            mDB = db; 
    } 
    

    Cela génère une erreur dans MainActivity, car vous avez ajouté un argument au constructeur WordListAdapter.

  6. Ouvrez MainActivity et ajoutez l'argument mDB manquant.

    mAdapter = new WordListAdapter (this, mDB); 
    
  7. Exécutez votre application. Vous devriez voir tous les mots de la base de données.

Félicitations !

Vous avez complété la tâche 4. Vous avez mis à jour WordListAdapter pour afficher les données de la base de données. N'oubliez pas de committer sur la branche tp-sqlite de votre dépot git local.