Salut salut,

The health bar is probably one of the most important element of our video games. This is why they must be treated. They form an integral part of the game world. Imagine Zelda game without hearts and quarter heart... meh!

This guid in french:
https://lecomptoirduclickeur.fr/tutorial/barres-de-vie-qui-ont-du-style
The Exemple:
https://steamhost.cn/steamcommunity_com/sharedfiles/filedetails/?id=705828493

(I'm really sorry for all my English mistakes. I would try to do my best to correct them.)

First, we'll set the number of heal points. In the application properties, say "initial # of lives" on 20.

Let then a Lives object and modify its image:

A background to our bar it would be better, add a Backdrop object:

Our health bar is complete. Now test there a little.

In the event editor, create two events:

• Upon pressins "Up Arrow"
+ Number of lives of [player 1] < 20
∟ [player 1] : Add 1 to Number of Lives

• Upon pressing "Down Arrow"
+ Number of lives of [player 1] < 0
∟ [Player 1] : Substract 1 to Number of Lives

The condition "Number of lives of [Player 1] < 0" here is useless because the number of lives can not be negative. But if a global value is used for example it can be useful.

Let's run the frame, and voilà.

Ok, now something that has more class. such as less than graduations and the end of the gauge angled.

The object that we'll use can seem unexpected, this is the Text Blitter. This object is used to display text using an image instead of a font.

Let's start by changing the text to look like our health bar: [1##:###:###:###:###F]

We will use a global string. As a reminder it can be defined via the application properties.


We want that when the player loses a health point one letter is removed. That's what the string will serve. In the event editor add an event:

• Number of lives of [player 1] <> Len(Barre de vie )
∟ Set [Barre de vie] to Left$("[1##:###:###:###:###F]", lives("[player 1]") )

That means that when the number of HP is different from the number of characters in the string [life bar], this one is replaced by the "number of HP" first character "[1##:###:###:###:###F]"

It remains only to redefine our "Text Blitter", adding at the same time a character to the end angle:

∟ [Text Blitter] : Change text: [barre de vie] + "I"

We must also think about displaying our bar should be different for "0 HP" and "20 HP". Add two conditions to the event which becomes:

• Number of lives of [player 1] <> Len(Barre de vie )
+ Number of lives of [player 1] > 0
+ Number of lives of [player 1] < 20
∟ Set [Barre de vie] to Left$("[1##:###:###:###:###F]", lives("[player 1]") )
∟ [Text Blitter] : Change text: [barre de vie] + "I"

Then add the events:

• Numbre of lives of [player 1] = 0
+ Only one actior when event loops
∟ Set [Barre de vie] to ""
∟ [Text Blitter] : Change text: ""

• Numbre of lives of [player 1] = 20
+ Only one actior when event loops
∟ Set [Barre de vie] to "[1##:###:###:###:###]"
∟ [Text Blitter] : Change text: "[1##:###:###:###:###F]"

Ok, we're almost there. Edit our Text Blitter. Click on the "Edit Charmap" button and just put the characters that interest us: "[1#:F]I7"



And finally, the image:

Finally:

We have all dreamed at the mere sight of those little quarter hearts. More than a bar of life is the very essence of The Legend of Zelda that shines through it.

Already, observe a little how it looks:


A heart is divisible by 4, so a single heart made 4 HP. So we can already establish the string [Coeurs Zelda] to "12341234123412341234".


This time we'll use two Text Blitter, one for the upper quarters and one for the lower quarters. Both with the Charmap to "1423" and the image:

We also need a Strig Parser object to manipulate our string.

Add an event:

• Number or lives of [player 1] <> Len(Coeurs Zelda )
∟ Set [Coeurs Zelda] to Left$("12341234123412341234", lives("[player 1]") )

In the upper Text Blitter, only wants the "1" and "4". Use the String Parser to remove the "2" and "3":

∟ [String Parser] : Set source string to [Coeur Zelda])
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "2" )
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "3" )
∟ [Text Blitter 1] : Change text: string$( "[Sting Parser]" )

Then we did the same for the lower Text Blitter.

Also add a quick Backdrop object as background.

We could stop there. But it pointed out to me that in the Zelda games, health bars goes back slowly.

Let us and change our event, which becomes:

• Number or lives of [player 1] Len(Coeurs Zelda )
∟ Set [Coeurs Zelda] to Left$("12341234123412341234", lives("[player 1]") )
∟ [String Parser] : Set source string to [Coeur Zelda])
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "2" )
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "3" )
∟ [Text Blitter 1] : Change text: string$( "[Sting Parser]" )
∟ [String Parser] : Set source string to [Coeur Zelda])
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "1" )
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "4" )
∟ [Text Blitter 2] : Change text: string$( "[Sting Parser]" )

A small copy / paste to duplicate the event and edit it:

• Number or lives of [player 1] Len(Coeurs Zelda )


∟ [String Parser] : Set source string to [Coeur Zelda])
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "2" )
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "3" )
∟ [Text Blitter 1] : Change text: string$( "[Sting Parser]" )
∟ [String Parser] : Set source string to [Coeur Zelda])
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "1" )
∟ [String Parser] : Set source string to remove$( " [String Parser] ", "4" )
∟ [Text Blitter 2] : Change text: string$( "[Sting Parser]" )

Hm ... is missing a thing. The heart that flashes when it remains one. Creating an Active object under the first heart. Stopped animation: and Walking animation:

With that, we add tow events:

• Number of lives of [player 1] <= 4
+ Only one action when event loops
∟ [1er coeur vide] : Change animation sequence to Walking

• Number of lives of [player 1] > 4
+ Only one action when event loops
∟ [1er coeur vide] : Change animation sequence to Stopped

And that is our Zelda style health bar finally over. Ta Ta TaLaaa!