UI elements using UICorner "spill out" of frame

I am creating a game that primarily uses UICorners for its UI interface, and I’ve run into the problem of certain graphics “spilling out” of their respective frames. Here’s an example:

image

Note the progress bars clipping through the UIStroke frame. Is there any way to remedy this? I’ve tried using the ClipDescendants property, but it didn’t work since it doesn’t account for the rounded corners.

Does you’re UI bar have a child of UICorner in it? But I think you do have UICorner from the looks of it. If it doesn’t then try that, but if it does then I don’t know what to tell you. Try 9-Slice Design but I don’t know if that works tho.

Yes, the progress bar does have an UICorner child. I don’t see how 9-slice would help in this situation.

Just a suggestion, put potentially increase the stroke of the frame to cover the overspill. By the looks of it the central stroke around the skull is thicker than the other stroke and so it would make sense design wise to match that for consistencies sake. Could be killing two birds with one stone.

This is what I was doing before as a band-aid solution, but the super bold outlines looked off when contrasted with the rest of the UI (which has smaller outlines). I’ve currently opted to just reducing the curvature of the outlines so I can cover the overspill with the smaller outline width. I appreciate the suggestion, though.

I did some more digging in the forum and apparently this is a near unsolvable issue that plagues a lot of people, so much so that there’s an engine request for better ClipDescendants behavior. I guess I’ll have to live with this workaround.

Yeah totally agreed, it would only be a band-aid solution. But yeah, from my understanding you’re right, it’s an unsolvable issue as far as I am aware. Hopefully you’re satisfied with what solution you’ve found so far, take care bud.

1 Like