Progress bar in a progress bar - Material for health bar


I’m trying to create a health bar that has a separate bar inside it, sort of. In my game there are two types of damage: Normal and scratch damage - were the first just removes health, but the second is some the player accrues. I want the health bar to not only show how much health is left, but also how much scratch damage the player has, like so:

health bar.png&stc=1

Since such functionality seems beyond the progress bar widget. I’m trying to do it using a material, but I’m truly out of my depth. Anyone that can point me to a good tutorial, or have done something similar?

You can find such a material in the contentExamples free for download. It is used with clamp settings, as far as i know. Look at the Material and Texture there Game/Examplecontent/HUD/Materials - Textures. Its a bit tricky but if you understand it this should work. Let me know if that helped you.

Edit: of course you need to make more effects to the material then :slight_smile: One more gradient texture to the material.


Awsome! Thanks a lot! I will take a look :smiley:

A follow-up question. The material works fine, but I have a problem applying it to the HUD bar.
I create a material instance dynamic and apply the difference between health/max health as a parameter value.
In the widget editor I have an Image with a binding wherein I try to create “brush from material” - but no matter what I do, the bar remains white.


Couldn’t you just use an extra progress bar layered over top the first one?

That do sound infinitely easier. Thanks, Godling! For some reason, my brain was stuck on expanding the yellow bar from the end of the red bar towards the base. Don’t know why.