Guide complet Glide/Coil Kotlin : méthodes et exemples

Que sont Glide et Coil et pourquoi les utiliser ?

Dans le développement Android moderne, le chargement et l'affichage d'images depuis le réseau, des fichiers locaux ou des ressources est l'une des tâches les plus courantes. Cependant, télécharger simplement une image et l'afficher dans une ImageView ne suffit pas. Il faut prendre en compte de nombreux aspects : la mise en cache (pour économiser la bande passante), la gestion des erreurs (si l'image ne se charge pas), les transformations (avatars ronds, flou), la prise en charge des GIF et vidéos, ainsi qu'une animation fluide à l'apparition.

Glide et Coil sont les deux bibliothèques les plus populaires pour le chargement d'images en Kotlin/Android. Elles résolvent tous ces problèmes « prêts à l'emploi ».

• Glide — une bibliothèque puissante et mature (partiellement de Google). Prend en charge les GIF, vidéos, transformations, animations. Dispose d'une immense communauté.
• Coil — plus moderne, légère et entièrement écrite en Kotlin avec les coroutines. S'intègre parfaitement avec Jetpack Compose.

Dans cet article, nous allons examiner les deux bibliothèques, car elles résolvent les mêmes problèmes, mais de manières différentes. Vous pourrez choisir celle qui convient le mieux à votre projet.

Installation

Ajoutez les dépendances dans le fichier build.gradle.kts (niveau module app) :

Pour Glide :

dependencies {
    implementation("com.github.bumptech.glide:glide:4.16.0")
    kapt("com.github.bumptech.glide:compiler:4.16.0") // pour GlideApp
}

Pour Coil :

dependencies {
    implementation("io.coil-kt:coil:2.6.0")
    // Si vous utilisez Compose :
    implementation("io.coil-kt:coil-compose:2.6.0")
}

Après l'ajout, synchronisez le projet (Sync Now).

Démarrage rapide

Chargeons une simple image depuis Internet dans une ImageView.

Exemple avec Glide :

// Dans une Activity ou un Fragment
val imageView: ImageView = findViewById(R.id.my_image_view)
val url = "https://example.com/image.jpg"

Glide.with(this)
    .load(url)
    .into(imageView)

Exemple avec Coil :

// Dans une Activity ou un Fragment
val imageView: ImageView = findViewById(R.id.my_image_view)
val url = "https://example.com/image.jpg"

imageView.load(url)

Comme vous pouvez le voir, Coil propose une syntaxe encore plus concise grâce à la fonction d'extension load().

Méthodes et fonctions essentielles

Voici les méthodes clés pour travailler avec les images. Pour chaque méthode, je présente des exemples pour les deux bibliothèques.

1. load() — Chargement d'une image

Fonction : Méthode principale qui accepte une source d'image (URL, URI, File, Drawable, Bitmap).

Paramètres :

• url: String — lien vers l'image.
• uri: Uri — URI local.
• file: File — fichier.
• resourceId: Int — ID de ressource (R.drawable...).

Exemple (Glide) :

Glide.with(this)
    .load("https://example.com/photo.png")
    .into(imageView)

Exemple (Coil) :

imageView.load("https://example.com/photo.png")

2. placeholder() — Image de remplacement

Fonction : Affiche une image temporaire pendant le chargement de l'image principale.

Paramètres :

• placeholder: Int — ID de la ressource drawable.

Exemple (Glide) :

Glide.with(this)
    .load(url)
    .placeholder(R.drawable.ic_loading)
    .into(imageView)

Exemple (Coil) :

imageView.load(url) {
    placeholder(R.drawable.ic_loading)
}

3. error() — Image en cas d'erreur

Fonction : Affiche une image si le chargement de l'image principale échoue.