Animated Health Displays (bar & circle)

Hi there!
DG Animated Health Displays (from Damian Gonzalez) gives you a simple-to-use customisable visual display for your player's health, ammo, progress, or whatever you want to keep track of and show players in the UI.
You will find two prefabs in this asset:
- Animated Health circle
- Animated Health bar
Both prefabs include an optional damage mask, that applies a red vignette effect to the screen to contribute to communicate the sense of danger and pain the character is in.
In this video you'll see demo scene and implementation example from scratch, for both circular and bar displays.
Since it's an UI element, it can be used for 2D or 3D games.
What "animated" means?
It actually has 2 animations:
- One for the circle or bar itself: The green part won't go suddenly from one point to the other, but slowly.
- The numbers will pulsate when they change, suddenly modifying its color and size, and then slowly going back to the original ones.
It will read and remember settings on the text, like its normal color and font size. And you can choose a color and font size for when it flashes.
For example, you can set it to flash green when increases, and flash red when decreases.
Things you can setup from the script in the inspector:
- Max health
- Show number: Whether you want the number to display or not
- Animate Numbers too: Maybe you don't want the numbers to animate. You can choose that.
- Animation speed: How fast/slow the green color will reach its destination
- Show Damage Mask: Whether you want to see the red tint or not.
- Use Mask Only below...: Maybe you want the mask to show only below 4 points of health, or only in the last 3. This won't just hide the mask for certain values. It will also recalculate the opacity.
For example: if you choose "only below 2", 2 points of health (and above) will trigger 0% opacity, 1 point 50% opacity and 0 points 100%.
But if you choose "only below 4", 4 and 5 points will set 0%, 3 points will set 25%, 2 points will set 50%, etc.
You can also set the number it self:
- Color animation when increases
- Color animation when decreases
- How much the size grows when flashing
- How fast/slow it goes back to normal color/size
And obviuosly you can easily change other things from the text itself: font, position, anchor, etc. For example you can put the number above the bar, at its right, etc.
This asset uses TextMesh Pro, but don't worry, it almost installs it self.
Installing this asset and using it is very easy. You can see the documentation if you want more details.