How to Use COIL Image Loader Library in Android Apps?

Last Updated : 23 Dec, 2020

COIL is an acronym for Coroutine Image Loader. COIL is one of the famous image loading libraries from URLs in Android. It is a modern library for loading images from the server. This library is used to load images from servers, assets folder as well as from the drawable folder in Android project. The important feature of this library is that it is fast, lightweight, and easy to use. In this article, we will see How to Use this Image Loader Library in Android Apps.

Why We Should use COIL for Loading Images?

COIL Image loading library is provided by Kotlin Coroutines which is used for loading images in Android. This library is specially designed for loading images in Kotlin. It is modern, easy to use, lightweight, and fast for loading images from the server. This is the new library and provides new optimization for loading images from the server very efficiently. As Kotlin is now been officially announced as the preferred language for Android development, that’s why for loading images we should prefer using COIL for loading images in Android.

What are the Advantages of using COIL over Picasso, Glide, and UIL?

Google has officially announced Kotlin as a preferred language for Android development and COIL is the library that is better optimized with Kotlin. So the optimization of this library with Kotlin makes it easier to load images from the server.
COIL loads images very faster with the number of optimizations which includes memory, disk caching, reusing of bitmaps, and down spacing the image in memory which makes it faster in comparison with other image loading libraries.
COIL adds ~2000 methods to your APK which are very less in number in comparison with Picasso, Glide, and UIL. This makes this library very lightweight and easy to use.
COIL is the first image loading library which is completely introduced in Kotlin and it uses some modern libraries of Android such as Okio, OkHttp, and AndroidX lifecycles.

Step by Step Implementation of COIL Image Loading Library

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.

Step 2: Add dependency of Coil Image Loading library in build.gradle file

Navigate to gradle scripts and then to build.gradle(Module) level. Add below line in build.gradle file in the dependencies section.

implementation(“io.coil-kt:coil:1.1.0”)

After adding dependency click on the “sync now” option on the top right corner to sync the project.

Step 3: Adding internet permission in the AndroidManifest.xml file

Navigate to the app > Manifest to open the Manifest file. In the manifest file, we are adding internet permission to load images from the internet. Add the following lines in your manifest file.

<!–Permission for Internet–>

<uses-permission android:name=”android.permission.INTERNET” />

<uses-permission android:name=”android.permission.ACCESS_NETWORK_STATE” />

Step 4: Create a new ImageView in your activity_main.xml.

Navigate to the app > res > layout to open the activity_main.xml file. Below is the code for the activity_main.xml file.

XML

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"> 
  
    <!--ImageView is created below-->
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_centerInParent="true"
        android:contentDescription="@string/app_name" /> 
  
</RelativeLayout>

Step 5: Working with the MainActivity.kt file

Go to the MainActivity.kt file and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.

Kotlin

import androidx.appcompat.app.AppCompatActivity 
import android.os.Bundle 
import android.widget.ImageView 
import coil.load 
  
class MainActivity : AppCompatActivity() { 
  
    // image url that we will load in our image view.  
    val imgurl = "https://www.geeksforgeeks.org/wp-content/uploads/gfg_200X200-1.png"
  
    override fun onCreate(savedInstanceState: Bundle?) { 
        super.onCreate(savedInstanceState) 
        setContentView(R.layout.activity_main) 
          
          // val created for our imageview and  
          // initializing it with image id.  
        val img = findViewById<ImageView>(R.id.imageView) 
          
          // below line is for loading  
          // image url inside imageview. 
        img.load(imgurl) { 
            // placeholder image is the image used  
              // when our image url fails to load.  
            placeholder(R.drawable.ic_launcher_background) 
        } 
    } 
}