Thanks for the +1 super.
I called it a Horizontal bar because I want it to be more than just a health bar. That's okay for a simple shoot'em up. For a more busy shoot'em up you might want an ammo or shield bar as well. For example, you could create a ship with 3 bars attached to it (ammo, shield, health). Do it as follows:-
Step 1. Copy and paste the
hBar global code into Global Editor and save it as hBar (as shown in original post).
Step 2. Create 3 canvas actors. Name them
ammoBar,
sheildBar,
healthBar.
(that's:
Add actor => type in settings: Name=ammo, Type=canvas => [add] Repeat for other two).
Step 3. Create an actor variable named
itsValue.
(that's:
Script => Global Code -> [variables] => [add] => type setting as: Name=itsValue, Type=integer, Scope=Actor variable => [add] )
IMPORTANT. Learn to be efficient (comes with practice). Why create 3 additonal actor variables like ammo, sheild and health if you
can get way with just 1 variable and access it's value with
ammoBar.
itsValue or
sheildBar.
itsValue or
healthBar.
itsValue. An additional bonus for doing it this way is that you can use it for all other actors that allow it (
anyActor.
itsValue), makes life easier, hey?
To set startup state for each bar you would but some code in the canvas actors
CREATE ACTOR EVENT (for ammo, sheild and health).
Step 4a. Startup Location. You would obviously want to set your bars position so that they follow your ship as it moves around the screen. So you have to set up the x, y position of each canvas actor (ammo, sheild and health) relative to you player ship Actor (whatever you called it, I call it playerShip for convenience).
- Code: Select all
// Your in CREATE ACTOR EVENT (of Health Bar canvas actor)
x=playerShip.x - healthBar.width/2; // roughly across middle of playerShip NOT WHAT YOU WANT!
y=playerShip.y - healthBar.height/2; // roughly down middle of playerShip NOT WHAT YOU WANT!
The problem with the above positioning code is that it places your bar smack in the middle of your player ship. It's good for finding the centre of your ship but you would ideally want to put the bar either above or below your ship. Like the code below (examples given for above, below, left & right of player ship).
- Code: Select all
// THIS CODE WOULD GO IN YOUR CANVAS ACTOR'S CREATE EVENT.
// For this positioning to work as intended make sure you resize the canvas as close as possible to dimensions of your bar.
// Place bar CENTRED ABOVE player ship
x=playerShip.x + playerShip.width/2 - healthBar.width/2;
y=playerShip.y - playerShip.height/2 - healthBar.height/2 - offSet; // you would enter offset manually to fine tune positioning
// ALTERNATIVELY Place bar CENTRED BELOW player ship
x=playerShip.x + playerShip.width/2 - healthBar.width/2;
y=playerShip.y + playerShip.height/2 - healthBar.height/2 + offSet; // you would enter offset manually to fine tune positioning
// ALTERNATIVELY Place bar CENTRED LEFT of player ship
x=playerShip.x - playerShip.width/2 - healthBar.width/2 - offSet; // you would enter offset manually to fine tune positioning
y=playerShip.y + playerShip.height/2 - healthBar.height/2;
// ALTERNATIVELY Place bar CENTRED RIGHT of player ship
x=playerShip.x + playerShip.width/2 + healthBar.width/2 + offSet; // you would enter offset manually to fine tune positioning
y=playerShip.y + playerShip.height/2 - healthBar.height/2;
Step 4b. Display bar. Just add the
hBar( your preferences
); code with your design preference in the
( ) brackets part. Example code for placing your bar centred below your player ship:-
- Code: Select all
// Place bar CENTRED BELOW player ship
x=playerShip.x + playerShip.width/2 - healthBar.width/2;
y=playerShip.y + playerShip.height/2 - healthBar.height/2 + offSet; // you would enter offset manually to fine tune positioning
// create and display the bar
hbar (50, 50, 5, 0, 255, 0, 128, 128, 128, 0, 255, 0);
Obviously you would repeat this for each of the 3 bars (ammo, shield, health).
Step 5.
Working Bar. To actually see the bar move when your ammo, shelld or health changes you would need to change the
itsValue variable associated with it but this is not enough you would have to do 2 things.
5a) Change
itsValue for ammo, sheild or health as follows:
THIS CODE WOULD GO WHERE EVER THE CHANGE TAKES PLACE IN YOUR GAME
(by using canvases
actorName.
itsValue you can manipulate ammo, sheilds & health from outside of the canvas code parts, that 's to say, where ever your dealing with changes when enemy strikes a hit, you reload ammo, you get a PowerUp, etc...).
- Code: Select all
//ammo reloaded
ammoBar.itsValue += AmountReloadedBy; // AmountReloadedBy whatever it is
//ammo depleted
ammoBar.itsValue -=AmountDepletedBy; // AmountDepletedBy whatever it is
//You get a rare drop from enemy kill (PowerUp is Sheilds)
shieldBar.itsValue += ByPowerUpDropSize; // ByPowerUpDropSize whatever it is
//Enemy strikes a hit at Sheilds
shieldBar.itsValue -= ByEnemyDamageAmount; // ByEnemyDamageAmount whatever it is
//You get a rare drop from enemy kill (PowerUp is Health)
healthBar.itsValue += ByPowerUpDropSize; // ByPowerUpDropSize whatever it is
//Enemy strikes a hit
healthBar.itsValue -= ByEnemyDamageAmount; // ByEnemyDamageAmount whatever it is
5b) Dispay the changes in the bar.. In the DRAW ACTOR EVENT of your bar (ammo, sheild, health) add the following code:
- Code: Select all
// In DRAW ACTOR EVENT of ammo bar (the canvas actor)
hbar (ammoBar.itsValue, 50, 5, 0, 255, 0, 128, 128, 128, 0, 255, 0);
// In DRAW ACTOR EVENT of sheild bar (the canvas actor)
hbar (sheildBar.itsValue, 50, 5, 0, 255, 0, 128, 128, 128, 0, 255, 0);
// In DRAW ACTOR EVENT of health bar (the canvas actor)
hbar (healthBar.itsValue, 50, 5, 0, 255, 0, 128, 128, 128, 0, 255, 0);
Hope that helps people with bar positioning and use.
On a different topic altogether, user input. You could use the hBar as an input slider by putting code in its MOUSE DOWN EVENT. Say if xmouse value is left of bar centre (when mouse clicked) decrease barValue or if xmouse is right of bar centre increase barValue. You'd have a very simple way of setting game preferences (e.g. initial game resources: ammo, fuel, etc... difficulty level, easy to hard, so on ... Alternatively, just use left/right mouse clicks on bar to set the value.
Will be creating more gui widgets. Done the Vertical Bar (vBar) version so will add that tonight later...Running out of time, sorry for any typos, in a rush, got more to add...got to go
Take care all!
