Glide/Coil for Kotlin: Complete Guide with Examples

What are Glide and Coil and why are they needed?

\n\n

In modern Android development, loading and displaying images from the network, local files, or resources is one of the most common tasks. However, simply downloading a picture and showing it in an ImageView is not enough. Many nuances need to be considered: caching (to save traffic), error handling (if the image fails to load), transformations (circular avatars, blur), GIF and video support, as well as smooth appearance animations.

\n\n

Glide and Coil are the two most popular libraries for loading images in Kotlin/Android. They solve all the listed problems "out of the box".

\n\n

\n
• Glide — a powerful, mature library from Google (partially). Supports GIF, video, transformations, animations. Has a huge community.
\n
• Coil — a more modern, lightweight library written entirely in Kotlin using coroutines. Integrates perfectly with Jetpack Compose.
\n

\n\n

In this article, we will look at both libraries, as they solve the same tasks but in different ways. You will be able to choose the one that best suits your project.

\n\n

Installation

\n\n

Add the dependencies to the build.gradle.kts file (module level app):

\n\n

For Glide:

\n

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

\n\n

For Coil:

\n

dependencies {\n    implementation("io.coil-kt:coil:2.6.0")\n    // If using Compose:\n    implementation("io.coil-kt:coil-compose:2.6.0")\n}

\n\n

After adding, synchronize the project (Sync Now).

\n\n

Quick Start

\n\n

Let's load a simple image from the internet into an ImageView.

\n\n

Example with Glide:

\n

// In Activity or Fragment\nval imageView: ImageView = findViewById(R.id.my_image_view)\nval url = "https://example.com/image.jpg"\n\nGlide.with(this)\n    .load(url)\n    .into(imageView)

\n\n

Example with Coil:

\n

// In Activity or Fragment\nval imageView: ImageView = findViewById(R.id.my_image_view)\nval url = "https://example.com/image.jpg"\n\nimageView.load(url)

\n\n

As you can see, Coil offers an even more concise syntax through the load() extension function.

\n\n

Main Methods and Functions

\n\n

Below are the key methods for working with images. For each method, I will show examples for both libraries.

\n\n

1. load() — Loading an Image

\n

What it does: The main method that accepts an image source (URL, URI, File, Drawable, Bitmap).

\n

Parameters:

\n

\n
• url: String — link to the image.
\n
• uri: Uri — local URI.
\n
• file: File — file.
\n
• resourceId: Int — resource ID (R.drawable...).
\n

\n

Example (Glide):

\n

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

\n

Example (Coil):

\n

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

\n\n

2. placeholder() — Placeholder Image

\n

What it does: Shows a temporary image while the main image is loading.

\n

Parameters:

\n

\n
• placeholder: Int — drawable resource ID.
\n

\n

Example (Glide):

\n

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

\n

Example (Coil):

\n

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

\n\n

3. error() — Error Image