Search code examples
androidoverlayandroid-glide

Glide overlay two image urls into the same imageView


I am using Glide and I would like to load an image from a url and then overlaying another image from another url and then putting the two overlaying result into an imageView.

I have looked into the other question about overlaying two images into an imageView with Glide but it uses a drawable for the second image and I don't have the luxury of using a drawable for any of the images because everything will be loaded from urls at runtime.

This is what I would like to achieve:

Glide.with(context)
         .load("www.example.com/firstImage.jpg")
         .overlayFrom("www.example.com/transparentImage.jpg")
         .into(imageView);

I know .overlayFrom() isn't a method in Glide but is there a custom transformation I can use? Every transformation I've researched either does cropping or coloring and none I've found does overlaying. I would like to at least be pointed in a direction that would help me achieve this.

I am also open to switching to any other 3rd party imaging library that can allow me do this.


Solution

  • You cannot directly display two images in a single imageView without using a custom view.

    If you want to use Glide and achieve similar functionality, place another ImageView just above your ImageView (By wrapping them in a FrameLayout or a RelativeLayout).

    Then load overlay image in the ImageView at the top and set its alpha to 0.5 or any desired value.