How to not scale a child with frame

I’m having an issue using ClipDescendants to cut a custom health bar that uses an image by player health.

While the code for resizing the frame works correctly, the descendants of the frame is getting resized with it, which given I want to use ClipDescendants, is not ideal.
I figure the solution would be to resize the child by the inverse of the value of the frame changing, but I genuinely have no idea how to accomplish this.

Any idea how I would go around managing this? The code as is below.

local char = player.Character or player.CharacterAdded:Wait()

local playerUI = script.Parent.PlayerStats
local healthBar = playerUI.BaseBar.HealthClip
local StaminaBar = playerUI.BaseBar.StaminaClip

game:GetService("RunService").RenderStepped:Connect(function()
	local humanoid = char:FindFirstChild("Humanoid")
	healthBar.Size = UDim2.new(humanoid.Health/humanoid.MaxHealth,0,1,0)
	-- healthBar.Health.Size = UDim2.new(healthBar.Size.X.Scale,0,1,0)
end)

Commented out the attempt on the last line just to show the attempt, I know it won’t exactly do anything.

2 Likes

The best thing I can think of would be to get the ratio of the size difference at the start

local ratio = healthBar.Health.Size.X.Scale/healthBar.Size.X.Scale

then change the size according to the ratio later.

healthBar.Health.Size = UDim2.new(healthBar.Size.X.Scale*ratio,0,1,0)

which leads to this:

local char = player.Character or player.CharacterAdded:Wait()

local playerUI = script.Parent.PlayerStats
local healthBar = playerUI.BaseBar.HealthClip
local StaminaBar = playerUI.BaseBar.StaminaClip
local ratio = healthBar.Health.Size.X.Scale/healthBar.Size.X.Scale

game:GetService("RunService").RenderStepped:Connect(function()
	local humanoid = char:FindFirstChild("Humanoid")
	healthBar.Size = UDim2.new(humanoid.Health/humanoid.MaxHealth,0,1,0)
	healthBar.Health.Size = UDim2.new(healthBar.Size.X.Scale*ratio,0,1,0)
end)

Honestly, I don’t think “ratio” is the right word for this, but I honestly can’t think of another word lol

1 Like

Can’t you just parent it to the same frame then change the zindex?

1 Like

Seems the same things happening still…? For screenshot context real quick here;

Damaged
image

As compared to full
image

Ignore the slight offset on full, fixing that separately.

Also, I forgot to add the first line of code defining player, my bad.

I don’t think so, given I’m using the frame for ClipsDescendants. Having the frame in front wouldn’t accomplish much given it’s invisible

Is there something changing the Y Scale of the HealthBar? I believe it shouldn’t change the size there, but could you show you selecting the healthBar when damaged?

For some reason, it doesn’t seem to be updating the UI’s selection at all. Even moving it manually doesn’t do anything, so I’m not sure it’s going to do much good…

The only thing affecting scale script-wise is what I sent so I don’t think there’d be an outside factor in play…

Regardless of that here’s the screenshot anyway, just in case I’m misinterperating what studio’s trying to tell me.
image

And also, if by chance it matters, the hierarchy of the UI.
image

Honestly, I can’t think of much as to why this is happening, but I can think of a way that might be able to reverse it into the correct size.

healthBar.Health.Size = UDim2.new(healthBar.Size.X.Scale*ratio,0,healthBar.Size.X.Scale*ratio,0)

I’m thinking that the Y size is decreasing along with the X size for some reason

Sorry to take up so much of your time with this, this is… Frustraiting.

image

It seems it’s now drifting off downwards.
At this point I’m at a loss, I’m not sure if there’s an easier method of achieving this that I’m missing but it really feels like this is more of a pain than it should be.

Well… That’s not what I was expecting… At this point, I believe it is a problem with the anchor point, but if it works without actually changing the size, I’m not exactly sure what the problem could be. Could you send me the UI and allow me to try and fix this on my side? It’s fine if you don’t, but I’m not sure what the problem can be and am not sure if I can fix it by just telling you what to try.

More than happy to send it over. No shame in that I feel. Here

Player UI.rbxm (6.1 KB)

Thank you for the help though, it’s seriously apreciated.

Well, I completely see why it was doing that now. The bars sizes compared to what I thought they were are gigantic. It will take some time, but I think I can figure out a way.

2 Likes

Proposal: Instead of resizing the healthbar, why don’t you just move the position?

I didn’t even realize that was an issue. Completely my bad, UI is… Definitely not my forté.

Again though, I appreciate the help!

As in moving the full health bar to the left? I suppose that would work, but it wouldn’t look too right given I’m replicating a style, not that most players would care about something so minuscule, but the perfectionist in me would rather figure this out both for future reference and given… It will bug me to no end.

That is entirely a me issue though.

Here is your beloved health bar

local player = game.Players.LocalPlayer
local char = player.Character or player.CharacterAdded:Wait()

local playerUI = script.Parent.PlayerStats
local healthBar = playerUI.BaseBar.HealthClip
local StaminaBar = playerUI.BaseBar.StaminaClip
local ratio = healthBar.Health.Size.X.Scale/healthBar.Size.X.Scale

game:GetService("RunService").RenderStepped:Connect(function()
	local humanoid = char:FindFirstChild("Humanoid")
	healthBar.Health.Position = UDim2.fromScale((humanoid.Health / humanoid.MaxHealth) - 1, healthBar.Health.Position.Y.Scale)
end)

Alright, I have fixed the health bar’s issue. I changed the healthBar variable to the Health image under the HealthClip and directly changed that size. To correct the weird scaling issue, I changed the ScaleType to Slice and the SliceScale to 0, so the image looked correct. I also changed the size of the HealthClip and Health to fit the holder. You will want to do the same thing for the Stamina part of the UI.
Player UI.rbxm (6.1 KB)

Also, UI isn’t my forté either. I handle them a lot on the games I have worked on with others.

Works practically perfectly, image was a little stretched at first but, thank you!

Solution from @TheManInCity above also worked too, so thank you for that.