Check Progress To Tween Color

[xft2008 (germ)]

function ChangeProgressBar()
	
	local CurrentHealth = Humanoid.Health
	local TotalHealth = Humanoid.MaxHealth
	
	local Progress = CurrentHealth / TotalHealth
	
	local SizeInfo = TweenInfo.new(0.25, Enum.EasingStyle.Sine, Enum.EasingDirection.InOut, 0)
	local SizeProps = {Size = UDim2.fromScale(Progress, 1)}
	local SizeTween = TS:Create(HealthBar, SizeInfo, SizeProps)
	-- Past this point is where I don't know how to Tween the Colors of the Health Bar
	local MaxHealthColor = Color3.new(0, 225, 0)
	local MidHealthColor = Color3.new(225, 225, 0)
	local MinHealthColor = Color3.new(225, 0 ,0)
	
	local ColorInfo = TweenInfo.new(0.25, Enum.EasingStyle.Sine, Enum.EasingDirection.InOut, 0)
	local SizeProps = {BackgroundColor3 = Color3.new()} -- It's not the end of the code, but I don't know what to put next
	
	SizeTween:Play()
	
end

Humanoid.HealthChanged:Connect(ChangeProgressBar)

I want to make a health bar, but I don’t know how to check the progress of it. I want to check to the progress in order to tween the color. Unless there is a different way of doing that.

Any help is appreciated!

[Dev_Peashie]

Do not try to check the progress of the bar refilling. Just tween both parameters, the refill and the color at the same time.
If the refill is 100% meaning 1, and the color should go from “red” to “green” on a scale of 1. Then your color should go on a scale of 1 from red to green while performing only 1 tween that handles both parameters.

Color3.new() uses a scale from 0 to 1 not 0 to 255. Thats Color3.fromRGB()

[KJry_s (MalleoZephyris)]

I do not suggest to use tween for this, instead let’s use

Color3.fromHSV(.3, 1, 1) -- green

and let’s slowly move it to:

Color3.fromHSV(0, 1, 1) -- red

So first we want to know the amount of health left in decimals so lets do:

local Progress = Health/MaxHealth

This will result into a value for 1 if full health and 0 if you are dead.
Now if the value is 1 we want the Hue (H) to be equal 0.3, but if it’s 0 we want it to be equal to 0, which is quite easy:

HealthBar.BackgroundColor3 = Color3.fromHSV(0.3 * Progress , 1, 1)

Note, this will slow the color yellow and orange as well, because basically what it does, it scrolls the Hue from left to right:

[xft2008 (germ)]

Wow! I didn’t know this! This works perfectly, thank you!

[Dev_Peashie]

Yup, I support that, but, OP wants to tween the color gradually I think, in which using the tween to match the Health is useful, or as OP said in the last message, changing it without the gradually progression is what they want xD

[xft2008 (germ)]

The tween that I used is only 0.25 seconds, which makes the color change almost seemless. So it works perfectly the way I wanted!

[KJry_s (MalleoZephyris)]

If you want to ‘tween’ it gradually I instead suggest to lerp it, but then you’d need to run it every single frame and do the lerp amount times deltaTime (the time change, also known as dt) so the lerp value would be.

Lerp(a, b, .5 * dt)

With a being the current value and each time getting updated when you run it and b being the value you want to achieve and this would result in the hue you want.