How to make stamina bar

For my game, I want my player to be able to dash with the shift key (my project)

The dash should be limited for a short amount of time and the stamina should refill constantly. The stamina is set with an attribute.

How do I visualize the stamina via a progress bar?

Hi @SayHiToMePls,

Check this UI tutorial on how to create your own progress bar: User Interface - Progress Bar | Learn PlayCanvas

And how do I get the value of my stamina from a different script?

Also, since the stamina value can be changed as an attribute, how I normalize the value so there won’t be any issues with the length of the progress bar?

You need to get a reference to the entity that uses the progressBar script:

const progressBarEntity = this.app.root.findByName('Progress Bar');

From there you can easily access the script and its value:

const currentValue = progressBarEntity.script.progressBar.progress;

I think the value is already normalized between 0 and the max image width. This line does that:

var width = pc.math.lerp(0, this.progressImageMaxWidth, value);

No, I mean: How to access the stamina value for the progress bar?

Like this?

const currentValue = progressBarEntity.script.progressBar.progress;

Unless you want the progress bar width:

const currentWidth = progressBarEntity.element.width;

Give the code a try, add some breakpoints or console logs to get a direct understanding of what each value is and how you can use it.

nonono! I don’t mean the value of the progress bar. I mean the value of a different script for the progress bar

I’ve sent you instructions on how to access a script from a different entity above:

I suggest you start with the PlayCanvas manual, scripting section, that explains the communication between entities and scripts:

https://developer.playcanvas.com/en/user-manual/scripting/

1 Like