Making health bar with lines

[FireDogeX (zxcv)]

How do i make a health bar like this?

Example: the lines means 10 health points, which means if a player has 100 MaxHealth, there would be 10 lines in the health bar, 200 max health means 20 lines, etc.

[SavAlt17 (sav_YT)]

So let’s say our bar is 500 pixels wide and our character has 100 health

500/100 = 5
So every 5 pixels, signifies a single health point.

Now we can create a new frame and size it to how we want,

Now 5*10 = 50, so we can move the frame 50 pixels.
Then clone it again and move it 50 pixels, and again, and again, and again.

Hope this helps

[Nico_Nic77 (Silly_dev1338)]

Hey there,
How exactly do you want the health bar to behave? Should it decrease fluently, or should it decrease in steps (like every 10hp one “health bar frame”)?

[FireDogeX (zxcv)]

I want it to decrease fluently, the lines are just visual indicators of how many health the character has.

[Nico_Nic77 (Silly_dev1338)]

Well then this does the trick:

local healthframe 	= script.Parent.Barframe
local original_size = healthframe.Size

local maxhealth = 100

local function visualize_health(health)
	local percentage = health / maxhealth
	healthframe.Size = UDim2.new(UDim.new(original_size.X.Scale * percentage, original_size.X.Offset * percentage), original_size.Y)
end

visualize_health(25) -- call this function with the players health whenever his health changes!!!

(“background” is red and “barframe” is green)

In your case you would have an overlay for the lines (higher zindex) and a black background (smallest zindex)

Hope this helps!

[ExercitusMortem (Exercitus)]

Just upload something like this as an image label, after making the background transparent

[FireDogeX (zxcv)]

The player can have variety of health, so putting an image label for the lines won’t work…

[keo164 (keo)]

How about using the bars stardew valley use for energy and health?
The bars length could be changed for more health (or kept the same with slower decreasing bar)

[ExercitusMortem (Exercitus)]

You can still do it. Make the imageLabel the maximum size (most hp you can have). Put it in a frame. Make the frame the smallest HP size, and enable ClipDescendants.
Like this, but obviously with a better image.