Limit An XP Bar Length?

Questions & Answers
1

My question is almost completely what the title says. I am wondering how I would limit the length of my xp bar to a certain amount. The best example of what I want to do would be Mincraft’s xp bar. Any ideas?

static var Kills : int = 0;
static var Money : int = 250;
static var Lives : int = 10;
var BasicTurret : Transform;
var Paused : boolean = false;
static var curExp : int;
var maxExp : int = 50;
var expTexture : Texture;
var level : int;

function LateUpdate()
{
}

function Update()
{
	if(Input.GetKeyDown(KeyCode.P)&& !Paused)
	{
		Paused = true;
		Time.timeScale = 0;
	}
	
	else if(Input.GetKeyDown(KeyCode.P)&& Paused)
	{
		Paused = false;
		Time.timeScale = 1;
	}
	
	if(Input.GetKeyDown(KeyCode.Alpha1))
	{
		Time.timeScale = 1;
	}
	
	if(Input.GetKeyDown(KeyCode.Alpha2))
	{
		Time.timeScale = 2;
	}
	
	if(Input.GetKeyDown(KeyCode.Alpha3))
	{
		Time.timeScale = 3;
	}
	
	if(Lives <= 0)
	{
		Lives = 0;
		
		Loose();
	}

		if(curExp > maxExp)
	{
		curExp = 0;
		maxExp = maxExp * 1.5;
		level++;
	}
}

function OnGUI()
{
	GUI.Box(Rect(Screen.width / 2 - 60, 10, 60, 20), "" + Kills);
	GUI.Box(Rect(Screen.width / 2, 10, 60, 20), "" + Lives);
	GUI.Box(Rect(10, 10 , 60, 20), "$" + Money);
	
	if(GUI.Button(Rect(10, 40, 40, 40), "Basic Turret"))
	{
		Money -= 350;
		
	}else{
	
	} 
	
	
	if(Paused)
	{
			
		if(GUI.Button(Rect(Screen.width / 2 - 30, Screen.height / 2 - 10, 60, 20), "Exit"))
		{
			Application.LoadLevel(0);
		}
		if(GUI.Button(Rect(Screen.width / 2 - 30, Screen.height / 2 + 20, 60, 20), "Quit"))
		{
			Application.Quit();
		}
	}
	
	GUI.Box(Rect(125, Screen.height - 35, curExp, 20), curExp + "/" + maxExp + " Level: " + level);
}

function Loose()
{
	Application.LoadLevel(0);
	
	Time.timeScale = 1;
	
	Kills = 0;
	Money = 250;
	Lives = 10;
}
2

There is some code “demo”:

if (xpBarLength >= 10) { // "10" can be anything you want
 level += 1;
 xpBarLength = 0;
}
3

You can “normalize” your XP and multiply it by a value, this puts it in a range between 0 and 1. something like this:

var xp : float;
var maxXp : float;
var xpBarFullRect : Rect;

function OnGUI() {
  var normalizedXp = xp / maxXp;

  var xpBarRect = xpBarFullRect;
  xpBarRect.width *= normalizedXp;
  GUI.Box(xpBarRect, xp + "/" + maxXp);
}
4

Pretty much what you need todo is normalise the xp (normalisation is turning a range as such as 0 → 40 to 0 → 1…

the formula for that is:

function normalise(minVal : float, maxVal : float, currValue : float)
{
    return((currValue-minVal) / (maxVal-minVal))
}

Please keep in mind that I never code in javascript + I coded this in a browser… so I can almost guarentee my code won’t work… but if u can read you should be able to translate my code into javascript (if you had of asked for C# ide been able to write 100% bug free code :P) and also, I havn’t tested this, this function is based purely on theory…

say we have a xp scale from 0 → 100 and curr xp == 54
get currValue and take min value from it
54 - 0 = 54
get the max value and take the min value from it
100 - 0 = 100
then we divide the new curr value by the new max value

54/100

which gives us 0.54

Then what you do is define the screenspace for the box

a--------------------b

c--------------------d

then when you draw the box you would give it this:

float normalisedXP = normalise(0, 100, 54);
GUI.Box(Rect(a.x, a.y, (b-a)*normalisedXP, c-a), "" + XP);

where a, b, c, d are defined Vector2’s who correlate to the size of how big you want the xp bar once it’s finished

5

I found the answer to be very simple. All I had to do was edit line 87 to be this:

GUI.Box(Rect(125, Screen.height - 35, (curExp*500)/maxExp, 20), curExp + "/" + maxExp + " Level: " + level);