Image overlay and formatting

I am creating a thumbnail presentation of a book. (example 1 - layer set up).
I have a dynamic background image on a group -CoverPageGroup (loaded from an AI service).
I then have a static overlay image (the blue border image with a transparent circle).

I need to have the dynamic background image smaller than the image group inside of it, so that it doesn’t cut off if it doesn’t fit perfectly. (see example 2).

Any thoughts on how to achieve this?


You should add another image element inside the imageOverlay group and align it with that transparent background. When you display the image, you should change the source of this image element. See a demo.
chrome_ITwh47hj8P

I set the layout of the outer group to be align to parent:
imagem

And the image is on the bottom with some margins:

Check the editor here if this helps:

Thanks so much for the reply. I tried the instructions and checked out your editor. I get a different result. I’ve Aligned it to Parent, however it still renders above.

Screenshot 2024-09-19 at 11.29.36 am

Ohh I forgot to mention. You should set the border roundness to something too, so it looks circular:

I was able to achieve it by using 2 images, aligned to the parent. This should work for now. Thanks

Screenshot 2024-09-19 at 11.37.54 am