ok so thnx to yseour I now know how to code alittle better and I love coding now but I have a problem I tried using a canvas to draw the shape but it didnt work so I need help adding a healthbar that appears onscreen.Thnx 
wait what its just a question
I know im making an example project to show u how to make a healthbar ok?
For now try looking at this old script in a game im developing called kallen supremacy (helping develop):
pc.script.attribute('maxHealth', 'number', 36);
pc.script.attribute('maxMana', 'number', 4);
pc.script.attribute('barHeight', 'number', 1.77);
pc.script.attribute('remainingMaterial', 'asset', [], {
type: 'material',
max: 1
});
pc.script.attribute('emptyMaterial', 'asset', [], {
type: 'material',
max: 1
});
pc.script.attribute('remanaMaterial', 'asset', [], {
type: 'material',
max: 1
});
pc.script.create('Phealth', function (app) {
// Creates a new Health instance
var Phealth = function (entity) {
this.entity = entity;
};
Phealth.prototype = {
startingset: function() {
this.stat=app.root.findByName('Top').script.player_stat;
this.maxHealth=this.stat.hp;
this.maxMana=this.stat.mana;
this.currentHealth=this.maxHealth;
this.currentMana=this.maxMana;
this.setHealth(this.maxHealth);
this.setMana(this.maxMana);
},
// Called once after all resources are loaded and before the first update
initialize: function () {
var healthBar = this.entity.findByName('Health Bar');
var manaBar = this.entity.findByName('Mana Bar');
if (healthBar) {
healthBar.destroy();
}
if (manaBar) {
manaBar.destroy();
}
this.healthBar = new pc.Entity();
this.healthBar.setName('Health Bar');
this.remaining = new pc.Entity();
this.remainingBox = new pc.Entity();
this.empty = new pc.Entity();
this.emptyBox = new pc.Entity();
this.manaBar = new pc.Entity();
this.manaBar.setName('Mana Bar');
this.remana = new pc.Entity();
this.remanaBox = new pc.Entity();
this.empty1 = new pc.Entity();
this.empty1Box = new pc.Entity();
this.entity.addChild(this.healthBar);
this.healthBar.addChild(this.remaining);
this.remaining.addChild(this.remainingBox);
this.healthBar.addChild(this.empty);
this.empty.addChild(this.emptyBox);
this.entity.addChild(this.manaBar);
this.manaBar.addChild(this.remana);
this.remana.addChild(this.remanaBox);
this.manaBar.addChild(this.empty1);
this.empty1.addChild(this.empty1Box);
this.healthBar.setLocalPosition(0, this.barHeight, 0);
this.remaining.setLocalPosition(-0.5, 0, 0);
this.remainingBox.setLocalPosition(0.5, 0, 0);
this.empty.setLocalPosition(0.5, 0, 0);
this.emptyBox.setLocalPosition(-0.5, 0, 0);
this.manaBar.setLocalPosition(0, 1.7, 0);
this.remana.setLocalPosition(-0.5, 0, 0);
this.remanaBox.setLocalPosition(0.5, 0, 0);
this.empty1.setLocalPosition(0.5, 0, 0);
this.empty1Box.setLocalPosition(-0.5, 0, 0);
this.startingset();
app.systems.model.addComponent(this.remainingBox, {
type: 'box',
castShadows: false,
castShadowsLightmap: false
});
app.systems.model.addComponent(this.emptyBox, {
type: 'box',
castShadows: false,
castShadowsLightmap: false
});
app.systems.model.addComponent(this.remanaBox, {
type: 'box',
castShadows: false,
castShadowsLightmap:false
});
app.systems.model.addComponent(this.empty1Box, {
type: 'box',
castShadows: false,
castShadowsLightmap: false
});
var remainingMaterial = app.assets.getAssetById(this.remainingMaterial).resource;
this.remainingBox.model.model.meshInstances[0].material = remainingMaterial;
var emptyMaterial = app.assets.getAssetById(this.emptyMaterial).resource;
this.emptyBox.model.model.meshInstances[0].material = emptyMaterial;
var remanaMaterial = app.assets.getAssetById(this.remanaMaterial).resource;
this.remanaBox.model.model.meshInstances[0].material = remanaMaterial;
this.empty1Box.model.model.meshInstances[0].material = emptyMaterial;
this.setHealth(this.maxHealth);
this.setMana(this.maxMana);
},
setHealth: function (health) {
this.currentHealth = health;
if (this.currentHealth <= 0) {
this.currentHealth = 0;
this.entity.script.player.die();
} else {
}
this.remaining.setLocalScale(1 * this.currentHealth / this.maxHealth, 0.1, 0.05);
this.empty.setLocalScale(1 * (this.maxHealth - this.currentHealth) / this.maxHealth, 0.1, 0.05);
},
setMana: function (mana) {
this.currentMana = mana;
if (this.currentMana <= 0) {
this.currentMana = 0;
//this.entity.script.enemy.die();
} else {
//this.entity.script.vehicle.hit();
}
this.remana.setLocalScale(1 * this.currentMana / this.maxMana, 0.1, 0.05);
this.empty1.setLocalScale(1 * (this.maxMana - this.currentMana) / this.maxMana, 0.1, 0.05);
},
reduce: function (amount) {
if(this.entity.script.player.equipped.ARMOUR.type==='ARMOUR') {
this.entity.script.player.armorAdv+=(amount/2);
this.entity.script.player.checkAdvance('armorAdv','wArmour');
}
this.setHealth(this.currentHealth - amount);
},
rMana: function (amount) {
this.setMana(this.currentMana - amount);
},
heal: function (amount) {
this.currentHealth += amount;
if (this.currentHealth>this.maxHealth) {
this.currentHealth=this.maxHealth;
}
this.remaining.setLocalScale(1 * this.currentHealth / this.maxHealth, 0.1, 0.05);
this.empty.setLocalScale(1 * (this.maxHealth - this.currentHealth) / this.maxHealth, 0.1, 0.05);
},
hmana: function (amount) {
this.setMana(this.currentMana + amount);
if (this.currentMana>this.maxMana) {
this.currentMana=this.maxMana;
}
this.remana.setLocalScale(1 * this.currentMana / this.maxMana, 0.1, 0.05);
this.empty1.setLocalScale(1 * (this.maxMana - this.currentMana) / this.maxMana, 0.1, 0.05);
},
// Called every frame, dt is time in seconds since last update
update: function (dt) {
this.healthBar.setRotation(app.root.findByName('Camera').getRotation());
this.healthBar.rotateLocal(90, 0, 0);
this.manaBar.setRotation(app.root.findByName('Camera').getRotation());
this.manaBar.rotateLocal(90, 0, 0);
//this.healthBar.setEulerAngles(0, 0, 0);
}
};
return Phealth;
});
This is what it could/should look like after script when u apply to the player. but u would have to edit it to fit ur fps game.
It hovers above the player but u can edit it to sit in the corner of the screen with a 2d screen
btw the healthbar script doesn’t work for meit just disappears when i parseit
Yes i remember it is in legacy script XD i will finish the health bar tutorial today so u can use that ok?
ok thnx for the script and the info even though I still am new to coding I can make a basic script