How to do overlapping images in UMG?

I can’t figure out how to get background images to overlap. I can get them to break out of their containers/panels but they push away other elements.

Can anyone show a simple setup for how to achieve the following (and assume that each colored image is its own transparent texture):

Hi, you can use an overlay and put them under there. The overlay is under the “Panel” section.

Right, and how do you set that up? How do you get the background images to break out of their boxes/panels without pushing away other boxes/panels?

EDIT: I just put 4 images on top of each other straight on the canvas, with a lower ZOrder value than everything else… not sure that’s best practice though.

Isn’t this what you wanted?

296360-overlay-1.png

How do you get the background images
to break out of their boxes/panels
without pushing away other
boxes/panels?

What do you mean? What the overlay does is it overlays its children, so if you would have several horizontal/vertical boxes inside they would overlay not push each other. Of course if you would have a horizontal/vertical box as child of the overlay and add further horizontal/vertical boxes to this box then they would again push each other.

From your image above what you could do to achieve that is: you would start with a canvas panel (default) and then add an overlay and scale it to the whole canvas panel. Then add the four images to the overlay and align the blue one to left, the green to right, the pink to down and the orange to top. To get the text you can also at a horizontal box or even a whole canvas and continue from there.

This is what I mean:

296412-overlay.gif

But yes, in the end, I just stacked all images straight on the canvas with absolute positioning and a low zorder and it seems to work… so far…

My solution (no idea if it’s best practice or not):

296413-capture.png

Just ignore overlays/borders etc, and stack them straight on the canvas with low zorder.