This question has been asked many times in many ways, However none of the vast sea of questions and responses touch on what exactly is trying to be achieved.
I am trying to create a solution or system which allows me to accurately fill or drain an arbitrary complex shaped health bar Kingdom Hearts II - Sephiroth Battle - YouTube from a normalized ratio of 0 being Min Health to 1 being Max Health.
There has been a Post about a Kingdom hearts style health bars in 2010 which linked to what is now know as the radial fill in unity 5.
Those methods only focused on the radial and horizontal aspects separately and not the candy cane shape in full.
The cutout method original posted has severe flaws with 0-1 calculation and results in full image breaking when cutout reaches 0 instead of the desired result as well as requiring an ungodly perfect gradient.
The other method talked about two separate images, one for the horizontal and one for the radial, seems like a poor solution as it would not hold up to other complex shapes such as a triangle health bar or Spiral like healthbar akin to Soul Reaver - YouTube.
This post is for all those who have come here for years trying to find THE solution for being able to fill and reveal complex healthbars. And for those who do not want to resort to just trying to buy an asset store pack that makes us reliant on developer updates.
The other solutions were using animated sprites which has overhead issues for using multiple textures. to achieve the proper visuals. but also comes with the caveat of not knowing what to do to link the animation to forward and reverse playback based on current health.
http://embed.gyazo.com/d05df8d6a394afdf997a10405a698f0e.gif
this is the closest I’ve seen someone get with a cutout shader but i myself have not been able to achieve this result… is anyone willing to spare some advice on how to achieve this request?
using UnityEngine;
using System.Collections;
public class AnimPlayer : MonoBehaviour {
public Animator Healthanimator;
public int minLevel;
public int maxLevel;
public int curLevel;
public int lastLevel;
public float LVI;
public float startHealth;
public float minHealth;
public float healthCap;
public float curHealth;
public float maxHealth;
public float Value;
public float animHealth;
// Use this for initialization
void Awake ()
{
healthCap = 560.0f;
Healthanimator = GetComponent<Animator>();
lastLevel = curLevel;
}
void Start()
{
Healthanimator.speed = 0.01f;
maxHealth = startHealth;
curHealth = maxHealth;
animHealth = maxHealth / healthCap;
}
// Update is called once per frame
void Update ()
{
minHealth = Mathf.Clamp(minHealth, 0.0f, 0.0f);
curHealth = Mathf.Clamp(curHealth, minHealth, maxHealth);
maxHealth = Mathf.Clamp(maxHealth, minHealth, healthCap);
healthCap = Mathf.Clamp(healthCap, 560.0f, 560.0f);
minLevel = Mathf.Clamp(minLevel, 1, 1);
maxLevel = Mathf.Clamp(maxLevel, 100, 100);
curLevel = Mathf.Clamp(curLevel, minLevel, maxLevel);
lastLevel = Mathf.Clamp(lastLevel, minLevel,maxLevel);
animHealth = Mathf.Clamp(animHealth, minHealth, 1.0f);
Healthanimator.Play("Healthanim", -1, animHealth);
LeveledUp();
Healthdrain();
}
void LeveledUp()
{
if(curLevel!=lastLevel)
{
maxHealth = startHealth + (curLevel * LVI)/7;
curHealth = maxHealth;
lastLevel = curLevel;
animHealth = maxHealth / healthCap;
}
}
void Healthdrain()
{
if(Input.GetKeyDown("space"))
{
Value = (curHealth / healthCap);
animHealth = Value;
}
}
}
this does it all 4 years i have been wanting this. anyone want to test and tell me if its not working correctly.
I feel what you want to do is primarily with the shader; you use the shader to draw a shape around a point, and then fill polygons with colour or vice versa depending on collisions or boolean states.
So that is the answer so imagine you draw a square with 5 vertices, one vertice in the centre the other four making up the shape of the square.
Then you can create a series of empty squares and rotate between filling sections of the square using the vertic in the centre to fill the triangles (in the square) between vertices with colour - to fill up you hp, and add effects while doing so, or vice versa when damaged. Currently Open GL is a good place to start when buying books as the processes will be similar to a good Unity shader book. And actually it is generally Open GL being used in the background.
Otherwise you have little choice but to use a health bar or code a visual hp system.
I hope that helps - and I struggle to find useful Unity shader tutorials or books, good luck.
Best Wishes
#GamesTechnologist
