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