Is there a way to set a parent to render after its children?

Of course one of the features of the new UI system is to set the rendering order of a group of objects at the same hierarchical level by changing their position in the hierarchy view. However, I'm currently trying to make a gauge UI element, where an image element would cover two sliders. The image should be the parent in this case, but this means that it will be rendered first and will not be covering the two sliders as a result.

I can think of a few workarounds such as making one of the sliders the parent, which feels intuitively wrong as well as complicating the positioning of the element, or using a mask of the inverse of the image - what a pain.

So is there a proper way to solve this, maybe using scripting?

 

Maybe changing the Z position? (note, haven't tried this, just thinking)

 

Great idea, but I just tried it and z positioning has no effect on the visual order of elements it seems.

 

A parent always render before its children. However, you can easily add an additional child (which should be the last child of the parent) which contains the image you originally had on the parent, and which is anchored and positioned to fully stretch with the parent so it overlaps one-to-one.