put three hearts at the left top and whenever the player dies make a blank in the hearts fill and then if there is no fill he gotta repeat from the start
I think you can make them by using them as a button or a clip, and look it out yourself, thatās all I think I know
edit: I added some clickable sections you can read about to know more about programming in general, and specifically JavaScript!
You are probably talking about making the visual aspect of the life system, otherwise you could just make a variable with the amount of lives the player has and slap a text object next to it.
What is a variable? (click me to open)
What Iām starting with is the most obvious and simplest one, and I am lazy enough to add:
Slapping-a-number-next-to-it Life System
You just kinda make a looping heart beat animation,
then slap a text object with a name,
and finally, if you had written it already, you set the text to the player health and add an āxā in between:
txt_healthAmt.setText("x " + player.health)
PS: donāt ask why Iāve written HEALTH instead of LIFE, I got it mixed upā¦
ā¦just roll with me for a bitā¦
ā¦Clearly you werenāt looking for this, alongside the fact that I wasā¦ half-joking with you, since I assumed you avoided it.
I included 2 OTHER separate ways we could go about that, and although they are different to how theyāre displayed, they all functionally do the same thing in-game.
The next one is as simple as the previous one, and probably more practical (assuming you donāt need more than 3 health)ā¦
Animated-heart-clips Life System
You just make a clip with 4 keyframes, starting from the first keyframe with 0 hearts up to the 4th keyframe with 3 hearts.
I named this one for this example ui_health.
then inside the ui_healthCLIPās update script (NOT the frame!), you just program it so that it would go to the frame number with the playerās amount of health:
If this option already satisfies you, you can leave and continue your project as normal!
ā¦unless youāre not satisfied with this option (or just VERY curious about it)ā¦
ā¦The last one is (probably) more dynamic and code orientedā¦
Dynamic Life System
and because I wanted to be cool, Iāll make it into an acronymā¦
DynaLiSys
*donāt worry, the popping heart animation is just the icing on the cakeā¦ a bit of a buggy oneā¦
for this one weāre going to be using CLONES! Thatās right, weāre not using the original clip itself!
The best part is that youāre (probably) going to LEARN about making clones in Wick Editor!
BWAHAHAHAHAHAHAHAHAHAHAHAHAHAHAHAH! YOU WILL NOW LEARN TO BOTH MAKE THIS SYSTEM AND TO USE CLONES! MY EVIL MASTERP-
So hereās a fun and interesting detail about clones:
the clones of an object are stored in an array called (object).clones, so from my best educated guess, you can do pretty much anything that you are capable of doing to arrays.
erm... what is an array?
first of all, we will create the clip ui_health (again) and write inside the update script so that it will keep adding clones until their number reach the playerās amount of health:
//inside the ui_health update script
//if the length of ui_heart.clones are less than the player's health
if (this.clones.length < player.health){
this.clone(); //make a clone
}
ā¦huh, this is easy! okay letās see what ha-
*ui_health proceeds to clone itself on speeds beyond comprehensionā¦
ah right I forgotā¦ the clones inherit all the originalās properties and all its scripts. So the clones will not only stay in the exact position as the original, but they will make clones of themselves.
continually.
So we wanted 2 things from the clones: (1) arrange the clones so that they sit beside each other and (2) make sure the clones donāt clone more of themselves.
(2) is the easiest to fix, all we have to to is make the objects check if they are a clone or not, so that the original can only do what it should do and the clones can only do what they should do(unless you forgot how to use conditional statementsā¦):
//still in the ui_health update script
if (!this.isClone){ //If i'm not a clone, I can only do this:
if (this.clones.length < player.health){
this.clone();
}
} else { //If we are a clone, we can only do this:
//whatever it is...
}
I do not know how conditional statements work!
for (1), let us set the cloneās X position and offset it to the right by a certain amount multiplied by its index number. (reminder about arrays: the index of an element is its position in the array, starting from 0);
//...still in the ui_health update script...
if (!this.isClone){
//... excerpt...
}
} else { //If i am a clone...
//position myself inside the canvas according to my index number
this.x = 60 + (65 * ui_health.clones.indexOf(this));
}
Just put the original off canvas and youāll get something like this:
ā¦well the Y position of ui_elementās clones will be set to the originalās no matter how high you put it (as demonstrated in the gif), so just position it how you see fit via code or by hand.
ā¦AND CONGRATULATIONS!
ā¦
ā¦
ā¦
ā¦youāre almost finished!
ā¦you remember these two buttons, right?
Self explanatory, as you have seen these two earlier:
if hurt is clicked, it will remove the player health by 1 until it reaches 0,
while if heal is clicked, it will add 1 to the player health until it reaches 3.
We made sure that it will keep cloning until the amount of clones are exactly set to the players health. But if the player were hurt:
We didnāt give it a way to remove those clones! *unecessarily dramatic gasp!
And no, removing the clones are (probably) not as complicated as you think.
ā¦So the next step is checking if the amount of clones is EXACTLY EQUAL TO the amount of player health by removing excess clones using the (object).remove() method:
//inside the ui_health update script... again... and again...
if (!this.isClone){
// yes we've seen this block of code before... keep reading... š«
if (this.clones.length < player.health){
this.clone();
// if the number of clones is bigger than the player health...
} else if (this.clones.length > player.health){
// ...identify the last clone in the array...
let dead = this.clones[this.clones.length - 1];
dead.remove(); // ...and eliminate it! :D
}
}
ā¦
Oh hey, it works! āŖ
CONGRATULATIONS! FOR REAL THIS TIME!!!
You finally made a life system, and fortunately that is all there is to it! The popping heart animation is simply a bonus, just for you!
albeit a small bonusā¦ khā¦
Now you not only know how to make a working life system, but you know how to use clones!
I hope youāre able to make fun things with this power.
Harder done than said but remove heart 3 when you get damaged, heart 2 when also damage and make it so game restarts or shows a death screen if the last heard disappears
once you learn javascript, hopefully these questions can be answered on your own. not saying that itās bad that you ask us, itās just that if you know how to do it yourself, the code will be exactly how you want it. and you donāt have to wait for one of us.
i canāt give you code right now, and I havenāt seen kringleās code, but hereās what I think.
Iām guessing that the āhurtā button has a code inside that does the hurting, or it has a function that calls code that does the hurting.
so you take whatever code is in there, and you slap it somewhere in the enemy code, wherever it may be (it will probably be in something like if(this touches player) {HURT CODE HERE}).
@KringlePrinkles please correct me if Iām wrong, and @Jordy if you need help, you can probably ask kringle.
that code explanation of the if this touches that doesnāt work because ive tried doing it myself before and if you were in his hit box for a second it will take all your hearts away but thaks for trying to help btw sorry if I ask too much, javascript is too hard to learn for me and in you guyās perspective its easy to say learn javascript, not trying to be rude here
It only just removes an increment of the player.health variable on click, so you were right.
I think thatās fair, since we did not create an invincibility timer for the player, and you could do this easily with variables.
So adding to Baronās explanation with pseudo-code and sentences:
// somewhere in the update script
if (Player invincibility timer is less than or equal to 0){
if (this touches player, and player cool down variable is less than or equal to 0)
{
- REMOVE A PLAYER LIFE
- ADD A CERTAIN AMOUNT TO THE PLAYER COOLDOWN
}
} else {
- remove an increment from the Player invincibility timer for each tick until 0
}
offtopic, although regarding Jordy's comment about JS being too hard to learn...
just take all of my words with a grain of salt, I donāt trust my words about JS either
Well I certainly did not say anything about how learning Javascript could be easy (although I think I had implied it, oops). I think it is okay if you found Javascript hard! Everyone learns from a different pace to process what we have learned (ā¦as long as weāre not too relaxed and or lazy).
I do understand why you think that sinceā¦ I will admitā¦ that took me quite some time to learn some of the ropes. (I do also wish that I could flawlessly write code or draw amazingly after learning anything in a short period of time, though that was my laziness taunting me)
Whatās funny is that I did not even try to apply PURE javascript onto a website yet, writing it from scratch with a text editor, so I might have little experience compared to those with much advanced experience.
This stuff only got a little more easier for me because I experimented with what I know and practiced problem solving as we do debugging (which is rewriting code to make it work as intended when it is not).
So if it seems too hard at first, just go back and learn/review one thing for today, and try to put it into practice or playing with itā¦ even though it may sound quite lame.
oh and you had to know some math too, because that is VERY integral to programming.
I do see what you mean. That reply is probably during my pretentious phase or something, and I think I was assuming that people would figure it out themselves (mostly because I WAS trying to figure out by myself at the time of posting that reply. Oops).
May you show me your project? I shouldāve made a video demo or example in case there were beginner users. The GIFs I shared arenāt cutting it.