Set Background Image to Relative Layout using Glide in Android - layout

Question

How can I do this using Glide? I want to cache image to use it another time also. Thanks in advance.

Answer 1

You can load an image in a RelativeLayout like this. I'm just showing you the hard part which is setting an image to the background.
For Glide version before 4.X
Glide.with(this).load(imageViewPath).asBitmap().into(new SimpleTarget<Bitmap>(relLayoutWidth, relLayoutHeight) {
#Override
public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
Drawable drawable = new BitmapDrawable(context.getResources(), resource);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
yourRelativeLayout.setBackground(drawable);
}
}
});
For caching, refer to this page: Caching and Cache Invalidation.
Update for Glide v4 onward:
GlideApp.with(this).load(R.drawable.backgroundimage).into(new SimpleTarget<Drawable>() {
#Override
public void onResourceReady(Drawable resource, Transition<? super Drawable> transition) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
yourRelativeLayout.setBackground(resource);
}
}
});

Answer 2

Currently, at version Glide version 4.9.0, you can set a background for Relative Layout as:-
Glide.with(MainActivity.this)
.load(IMAGE_URL)
.into(new CustomTarget<Drawable>() {
#RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
#Override
public void onResourceReady(#NonNull Drawable resource, #Nullable Transition<? super Drawable> transition) {
mLinearLayout.setBackground(resource);
}
#Override
public void onLoadCleared(#Nullable Drawable placeholder) {
}
});

Answer 3

I think the best way to achieve it's works with your own ViewTarget implementation, because this class has specific methods to be handled by Glide automatically in different scenarios.
The abstract implementation for ViewGroup (LinearLayout, RelativeLayout and so on).
public abstract class ViewGroupTarget<Z> extends ViewTarget<ViewGroup, Z> implements GlideAnimation.ViewAdapter {
public ViewGroupTarget(ViewGroup view) {
super(view);
}
/**
* Returns the current {#link android.graphics.drawable.Drawable} being displayed in the view using
* {#link android.widget.ImageView#getDrawable()}.
*/
#Override
public Drawable getCurrentDrawable() {
return view.getBackground();
}
/**
* Sets the given {#link android.graphics.drawable.Drawable} on the view using
* {#link android.widget.ImageView#setImageDrawable(android.graphics.drawable.Drawable)}.
*
* #param drawable {#inheritDoc}
*/
#Override
public void setDrawable(Drawable drawable) {
view.setBackground(drawable);
}
/**
* Sets the given {#link android.graphics.drawable.Drawable} on the view using
* {#link android.widget.ImageView#setImageDrawable(android.graphics.drawable.Drawable)}.
*
* #param placeholder {#inheritDoc}
*/
#Override
public void onLoadStarted(Drawable placeholder) {
view.setBackground(placeholder);
}
/**
* Sets the given {#link android.graphics.drawable.Drawable} on the view using
* {#link android.widget.ImageView#setImageDrawable(android.graphics.drawable.Drawable)}.
*
* #param errorDrawable {#inheritDoc}
*/
#Override
public void onLoadFailed(Exception e, Drawable errorDrawable) {
view.setBackground(errorDrawable);
}
/**
* Sets the given {#link android.graphics.drawable.Drawable} on the view using
* {#link android.widget.ImageView#setImageDrawable(android.graphics.drawable.Drawable)}.
*
* #param placeholder {#inheritDoc}
*/
#Override
public void onLoadCleared(Drawable placeholder) {
view.setBackground(placeholder);
}
#Override
public void onResourceReady(Z resource, GlideAnimation<? super Z> glideAnimation) {
this.setResource(resource);
}
protected abstract void setResource(Z resource);
}
The specific implementation, in this case for LinearLayout.
public class LinearLayoutTarget extends ViewGroupTarget<Bitmap> {
private Context context;
public LinearLayoutTarget(Context context, LinearLayout linearLayout) {
super(linearLayout);
this.context = context;
}
/**
* Sets the {#link android.graphics.Bitmap} on the view using
* {#link android.widget.ImageView#setImageBitmap(android.graphics.Bitmap)}.
*
* #param resource The bitmap to display.
*/
#Override
protected void setResource(Bitmap resource) {
view.setBackground(new BitmapDrawable(context.getResources(), resource));
}
}
To work with.
Glide.with(this.getApplicationContext())
.load(R.drawable.your_image)
.asBitmap()
.into(new LinearLayoutTarget(this.getApplicationContext(), (LinearLayout) yourLinearLayoutInstanceHere));
Or even more simple working without Bitmap.
The specific implementation.
public class LinearLayoutTarget extends ViewGroupTarget<Drawable> {
public LinearLayoutTarget(LinearLayout linearLayout) {
super(linearLayout);
}
/**
* Sets the {#link android.graphics.Bitmap} on the view using
* {#link android.widget.ImageView#setImageBitmap(android.graphics.Bitmap)}.
*
* #param resource The bitmap to display.
*/
#Override
protected void setResource(Drawable resource) {
view.setBackground(resource);
}
}
To work with.
Glide.with(this.getApplicationContext())
.load(R.drawable.your_image)
.into(new LinearLayoutTarget((LinearLayout) yourLinearLayoutInstanceHere));

Answer 4

Here's the code for Kotlin
Glide 4.9.x
Since the SimpleTarget is deprecated now we have to use CustomTarget as below
Glide.with(this).load(UCrop.getOutput(data)).into(object :
CustomTarget<Drawable>() {
override fun onLoadCleared(placeholder: Drawable?) {
TODO("Not yet implemented")
}
override fun onResourceReady(
resource: Drawable,
transition: Transition<in Drawable>?
) {
ib_pet_profile_image.background=resource
}
})

Answer 5

(SimpleTarget class is Deprecated So using CustomTarget class to Load image)
You can load an image in a RelativeLayout like this. I'm just showing you the hard part which is setting an image to the background.
For Glide version before 4.X (Without Deprecation)
Glide.with(this).load(ServiceGenerator.BASE_URL + url).into(new CustomTarget<Drawable>() {
#Override
public void onResourceReady(#NonNull Drawable resource, #Nullable Transition<? super Drawable> transition) {
yourRelativeLayout.setBackground(resource);
}
#Override
public void onLoadCleared(#Nullable Drawable placeholder) {
}
});

Answer 6

Glide.with(ctx).asBitmap().load(url).centerCrop().into(object: CustomTarget<Bitmap>(){
override fun onLoadCleared(placeholder: Drawable?) {
}
override fun onResourceReady(resource: Bitmap, transition: Transition<in Bitmap>?) {
val wRatio = view.width/resource.width.toFloat()
val hRatio = view.height / resource.height.toFloat()
val minRatio = min(wRatio,hRatio)
val destBitmap = Bitmap.createScaledBitmap( resource,(resource.width*minRatio).toInt(), (resource.height*minRatio).toInt(),false)
view.background = BitmapDrawable(resources,destBitmap)
}
})
This works for me
PS: There would be an error when the bitmap is too large
java.lang.RuntimeException: Canvas: trying to draw too large bitmap.
So you'd better scale that bitmap like what i did in above code

Answer 7

Thanks all. All of your answers helped me out. I also find useful solutions with Glide's official documentation. I have switched over to Glide App Module in order to have common usage of it.
https://medium.com/#nuhkocaa/manage-all-your-glides-in-a-single-class-with-glidemodule-on-android-4856ee4983a1

Answer 8

I needed to set the background of an ImageView (so I could set the foreground to a different image).
I eventually found https://github.com/bumptech/glide/issues/938#issuecomment-176150770, but that's a bit out of date. Through experimentation I altered it to the following to work with Glide 4 (similar to some of the other answers here):
/** #see ImageViewTarget
*/
abstract class ViewBackgroundTarget<Z>(view: View) : CustomViewTarget<View?, Z>(view) {
override fun onLoadFailed(errorDrawable: Drawable?) {
}
override fun onResourceCleared(placeholder: Drawable?) {
// This line is ESSENTIAL or else there will be occasional crashes like:
// "java.lang.NullPointerException: Attempt to invoke virtual method
// 'boolean android.graphics.Bitmap.isRecycled()' on a null object reference"
view!!.background = placeholder
}
}
/** #see BitmapImageViewTarget
*/
class BitmapViewBackgroundTarget(view: View) : ViewBackgroundTarget<Bitmap>(view) {
override fun onResourceReady(resource: Bitmap, transition: Transition<in Bitmap>?) {
view!!.background = BitmapDrawable(view.resources, resource)
}
}
/** #see DrawableImageViewTarget
*/
class DrawableViewBackgroundTarget(view: View) : ViewBackgroundTarget<Drawable>(view) {
override fun onResourceReady(resource: Drawable, transition: Transition<in Drawable>?) {
view!!.background = resource
if (resource is GifDrawable) {
resource.setLoopCount(LOOP_FOREVER)
resource.start()
}
}
}
use this with
Glide.with(myImageView)
.load(imageUrl)
.into(DrawableViewBackgroundTarget(myImageView))
I assume this would work easily for a RelativeLayout or other View types as well.