- Home /
How do I create a scrolling HP meter? (EarthBound style)
I want to create a battle system very similar to the game EarthBound's. One big issue I'm having right now though, is getting the scrolling HP and PP meters working correctly and making them look at least passable. I need to somehow make the numbers scroll up and down with a delay (so the player has time to save themselves before they die). But I'm having trouble making this look good.
It was suggested that I use transparent planes to hide a scrolling list of numbers from 0-9 to hide the numbers that shouldn't be displayed. I don't know how to do this though. I've tried using a Depth Mask Shader to cover the 3DText numbers. I'm just not sure what the best way to go about doing this would be. Any suggestions would help.
Also, if you don't know what I'm talking about, look up "EarthBound Battle System" on YouTube and you'll see just what I'm trying to accomplish.
Answer by robertbu · Dec 04, 2013 at 02:12 AM
I looked closely at several EarthBound videos. What I saw with the digits counting up. I did not see any scrolling. I've written the count-up type counter a couple of times. My methods was to use a texture atlas and change the uvs of the texture to change to a different digit. This is pretty easy using third-party tools like NGUI and EZGUI. Unity's new sprite might also work (I've barely started to play with it). Doing it without support tools would be a bit of work.
You can also do it using a text presentation component like GUIText, TextMesh or GUI.Label().
Here is a quick script that can be attached to a GUIText object. I it hard-coded to 3 digits, but with a bit of work it could be generalized:
#pragma strict
@script RequireComponent(GUIText)
public var delay = 0.2;
private var vals : int[] = [0,0,0];
private var _vals : int[] = [0,0,0];
public var score = 0;
private var _score = 0;
function Start() {
SetScore();
InvokeRepeating("SetVal", 0.0, delay);
}
function SetNewScore() {
score = Mathf.Clamp(score, 0, 999);
_score = score;
var t = score;
var s = score;
t = t / 100;
vals[2] = t;
t = s - t * 100;
s = t;
t = t / 10;
vals[1] = t;
t = s - t * 10;
vals[0] = t;
}
function SetVal() {
if (score != _score) {
SetNewScore();
}
var bChange = false;
for (var i = 2; i >= 0; i--) {
if (vals[i] != _vals[i]) {
_vals[i] = (_vals[i]+1) % 10;
bChange = true;
}
}
if (bChange)
SetScore();
}
function SetScore() {
guiText.text = _vals[2].ToString() + vals[1].ToString() + _vals[0].ToString();
}