- Home /
Floating Health Bars
I am attempting to create floating health bars for moving game objects. After a fair amount of Googling, I finally found a decent enough example to start with. The example I found uses GUI.DrawTexture with a normal Texture object (not a GUITexture or Texture2D). Here is the relevant code for the script I have attached to my game objects:
public class Creep : MonoBehaviour
{
public Texture barBG;
public Texture barFG;
private Vector3 barPos;
private float yOffset = 2.2f;
private float barWidth = 256.0f;
private float barHeight = 32.0f;
private float barScale = .25f;
public float maxHealth = 10f;
public float health;
private float healthPercent;
private float healthBar;
private Color highHealth = new Color(7.0f / 255.0f, 161.0f / 255.0f, 7.0f / 255.0f);
private Color mediumHealth = new Color(161.0f / 255.0f, 157.0f / 255.0f, 7.0f / 255.0f);
private Color lowHealth = new Color(161.0f / 255.0f, 42.0f / 255.0f, 7.0f / 255.0f);
private Color barColor;
void Start()
{
barWidth *= barScale;
barHeight *= barScale;
health = maxHealth;
healthPercent = health / maxHealth;
}
void Update()
{
barPos = Camera.main.WorldToScreenPoint(new Vector3(transform.position.x, transform.position.y + yOffset, transform.position.z));
barPos.y = Screen.height - barPos.y;
healthPercent = health / maxHealth;
if (healthPercent > 0.50f)
{
barColor = Color.Lerp(mediumHealth, highHealth, (healthPercent - 0.50f) / 0.50f); // want 1.00 to be 100%, want .50 to be 0%
}
else
{
barColor = Color.Lerp(lowHealth, mediumHealth, healthPercent / 0.50f); // want .50 to be 100%, want 0.00 to be 0%
}
}
void OnGUI()
{
GUI.color = barColor;
GUI.DrawTexture(new Rect(barPos.x - barWidth/2, barPos.y, barWidth, barHeight), barBG, ScaleMode.StretchToFill, true, 0.0f);
GUI.DrawTexture(new Rect(barPos.x - barWidth/2, barPos.y, barWidth * healthPercent, barHeight), barFG, ScaleMode.ScaleAndCrop, true, 0.0f);
}
}
This code does work and it accomplishes most of what I wish to accomplish, but I'm having trouble getting the colors to appear as I would like them to. The colors representing the RGB values I'm using should be bright and vivid. If I create a GUITexture in the game and set the same colors, the green looks like this:
But in-game, using the same texture file (but not as a GUITexture), it looks like this:
Is this because I'm using the GUI.color variable? Is there anyway to brighten it to display the intended RGB color value?
Also, if anyone has any recommendations for a better approach to implementing floating health bars, I'd love to hear it. I tried using GUITextures and Texture2D, but didn't have much luck with them. I'm still new to Unity and its API though, so I would appreciate any advice.
Note this whole thing becomes dramatically easier if you use 4.6 and the new UI. Simply attach a world space canvas with a slider and set the value.
Answer by zharik86 · Nov 12, 2014 at 08:09 PM
Your code is quite good. And yes, because you using GUI.color. But I would change it a little. I think, you have two textures of bar. One as a background (most likely in dark tones), and the second - full filling in the color (if you want change color in compliance with health as gradient, that color must be white). Further, I will write a simple example:
public Texture2D barBG; //use Texture2D
public Texture2D barFG;
...
void OnGUI() {
//First draw background of bar
GUI.color = Color.white; //resset gui color
GUI.DrawTexture(new Rect(barPos.x - barWidth/2, barPos.y, barWidth, barHeight), barBG, ScaleMode.StretchToFill);
//Second draw fill bar, but draw in group
GUI.BeginGroup(new Rect(barPos.x - barWidth/2, barPos.y, barWidth * healthPercent, barHeight));
//Apply color
GUI.color = barColor;
//Draw bar or him part
GUI.DrawTexture(new Rect(0, 0, barWidth, barHeight), barFG, ScaleMode.StretchToFill);
GUI.EndGroup();
}
I hope that it will help you.