Skip to content
Related Articles

Related Articles

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

filter_none

edit
close

play_arrow

link
brightness_4
code

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    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>

chevron_right


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

filter_none

edit
close

play_arrow

link
brightness_4
code

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. 
  
    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)
        }
    }
}

chevron_right


Output: 

COIL Image Loader Library Output

My Personal Notes arrow_drop_up
Recommended Articles
Page :