Weird shaped health bar

Help and Feedback Art Design Support
#1

Hello. This is how the tip of the GUI looks like.
image
The green bar will go down as the HP goes down, but currently it is not a straight bar, so this is how it looks like when that is done.
image
How do I overcome this?

1 Like
#2

UIGradient is what you need. It can make one part of image not transparent, and other one transparent, if you do 0.001 diffirence, like this:

Gradient.Transparency = NumberSequence.new({
NumberSequenceKeypoint.new(0, 0),
NumberSequenceKeypoint.new(0.4995, 0),
NumberSequenceKeypoint.new(0.5005, 1),
NumberSequenceKeypoint.new(1, 1),
})
2 Likes
#3

I don’t see how UIGradient would help me in this case. From what I understand what I need to do is setting the GUI up in a way that when the green bar goes out of the border it will clip and disappear. But the issue is that the border’s actual “borders”, as in the border of the imagelabel is a square, its not in sync with the image.

#4

What you need to do is what I described in this post:

1 Like
#5

Now I get it. Thank you so much

1 Like