So this is my healthbar
As you can see it’s a complex shape, with one side being slanted and the other being rounded. The green is to indicate health.
The problem is this stretching occurs when trying to change size of the health, are there any solutions?
I’m pretty sure if you’re using an image for the green you can turn on tile and it should cut it evenly! But if you want the circle on the end then I’m not sure how you’d stretch it without stretching the left.
Could I somehow use clip descendants and have the green part be a normal frame? (The healthbar border and everything is custom made outside of studio)
Yes, you could Parent the green part to the frame and just change the size of the frame.
So basically I have the custom border and import it. Then under/inside it I put a grey frame to act as the background and a green frame to act as health. Then I go back to the healthbar border and turn on clip descendants right?
You want to have clip defendants on and resize the frame the green frame/image’s Parent
It should
123456789101112131415
I Recommend using a CanvasGroup, it is better with ClipDescendants than with other Frames.
You can Apply Gradients and Corners to it, and it would apply correctly.
What’s a CanvasGroup? I haven’t heard of that
That’s exactly what I’m looking for! So how would I apply it in the situation? @DasKairo’s explanation was a bit unclear for me
Have the health frame in a canvas group that is inside the border (I’m pretty sure)
Inside the Canvas place a UIGradient and change the transparency of the very end to have a clean cut, and change the Rotation of the UIGradient to 135 to create the left angled side. Place a UICorner into the Canvas too for the right side
Place a frame (the health) inside the canvas, and put inside a UICorner to create the semiCircle right side.
The Canvas with the health should be on top of your background bar image
Hey 
, can you share the different properties for the ui corners, canvas groups, etc. I’m trying to replicate this but I can’t get it to work
Theres not really much information, heres some caps:
UIGradient in Canvas:
Canvas Properties
Just a UI corner for the semiCircle side of both health and Canvas
Yeah this is my ui Artist, tommy. Basically the whole ui border is custom made and imported, is that maybe the reason it’s not working? I don’t know much about ui design.
You can perfectly use the custom image/background your artist designed, the Health (green one) is the one that should be a frame.
Ohh got it, @snowparem is your team mate, oh ok. Well, I supplied more details, but its not really much what is required to achieve it to look like that.
Could @snowparem start a new topic showing the current results, properties and behaviour? So we can give it a check?
