Android Kotlin program to load image from url using glide

Configure Glide :

Go (here)[https://github.com/bumptech/glide] to check for the latest version of Glide. Open your build.gradle in your project file and add the below to the repositories tab :

repositories {
  mavenCentral()
  google()
}

Next, open the build.gradle module level file and add the below dependencies to add Glide :

implementation 'com.github.bumptech.glide:glide:4.11.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.11.0'

Make sure to pick the latest versions.

Sync the Android studio project. Next, we will add one ImageView and load image to it using Glide :

Create the Layout :

I am creating one new Activity with a layout for this example. It is called ImageLoaderActivity and the layout file is activityimageloader. I have added one ImageView to the layout. The complete xml file is as below :

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".image.ImageLoaderActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="287dp"
        android:layout_height="286dp"
        android:src="@drawable/ic_launcher_background"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:contentDescription="sample image" />
</androidx.constraintlayout.widget.ConstraintLayout>

Load image to the ImageView using Glide :

I am using one image from this site : ../images/robot.png. Open the activity and add the below code to load this image using Glide :

val url = "../images/robot.png"
val iv = findViewById(R.id.imageView)
Glide.with(this).load(url).into(iv)

make sure to add the internet permission in AndroidManifest.xml file :

Run the app and it will load the image in the imageview :

android kotlin glide example

If you want more, you can also get the success and failure callbacks like below :

Glide.with(this).load(url).listener(object: RequestListener<Drawable>{
            override fun onLoadFailed(
                e: GlideException?,
                model: Any?,
                target: Target<Drawable>?,
                isFirstResource: Boolean
            ): Boolean {

            }

            override fun onResourceReady(
                resource: Drawable?,
                model: Any?,
                target: Target<Drawable>?,
                dataSource: DataSource?,
                isFirstResource: Boolean
            ): Boolean {

            }

        })
            .into(iv)

Callbacks are useful to show progress status.

Full code :

The full code of ImageLoaderActivity is :

import android.graphics.drawable.Drawable
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.ImageView
import com.bumptech.glide.Glide
import com.bumptech.glide.load.DataSource
import com.bumptech.glide.load.engine.GlideException
import com.bumptech.glide.request.RequestListener
import com.bumptech.glide.request.target.Target
import com.codevscolor.androidexamples.R

class ImageLoaderActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_image_loader)

        loadImage()
    }

    fun loadImage(){
        val url = "../images/robot.png"
        val iv = findViewById<ImageView>(R.id.imageView)
        Glide.with(this).load(url).into(iv)

        Glide.with(this).load(url).listener(object: RequestListener<Drawable>{
            override fun onLoadFailed(
                e: GlideException?,
                model: Any?,
                target: Target<Drawable>?,
                isFirstResource: Boolean
            ): Boolean {

            }

            override fun onResourceReady(
                resource: Drawable?,
                model: Any?,
                target: Target<Drawable>?,
                dataSource: DataSource?,
                isFirstResource: Boolean
            ): Boolean {

            }

        })
            .into(iv)
    }
}

Where is the color and why codevscolor ?

Long story short, I love paintings and I paint on weekends. We(me and my wife) have one Youtube channel. Below is a video that I did recently. If you love this please do subscribe to support us 😊