if you really want to tune it corrently (have it grow EXACTLY as much as you need it each time, you will also need to understand and use Linear Increasment which also somewhat explains the concept.

First of all we start by defining a new movieclip, call it however you want and inside it draw a square or something similar (doesn't matter if it's a square or a rectangle)

Let's start by giving the movieclip some actions (by opening the actions window and clicking the movieclip), we start by declaring WHEN the actions happen, inside movieclips we always have to do this, I want the actions to happen each frame enter (meaning 1 / 12 per second for default) the code for this is

onClipEvent(enterFrame){

}

this does nothing yet, but it's the handler itself, in flash, a handler means something that triggers everytime something else happens, in this case that something is the frame increasing (works even if you used stop()).

Now a movieclip has a _width property, this specifies it's width on the stage, so all we have to do, is change it's width accordingly, I'll presume your score/health variable is _root.score , the name is irrelevant really... Let's say the score is around between 1 and 100 (this part is explained a lot better in AS: Linear Increasment), now presuming we want the bar's width to move between 1 and 100 and the score is between 1 and 100 all we have to do is type

this._width=_root.score;

In the bar's actions, we want this to happen on every "enterFrame", so now our code is:
onClipEvent(enterFrame){
this._width=_root.score;
}

Congrats, we have created a working bar... currently it's aligned to the center, but you can also align it to the right by adding this._x=baseX+this._width/2 (assuming you declared baseX in the 'load; part, which if i'm not mistaken my friend toast explained in AS variables. Same works for aligning it to the left.

This kind of health bar requires a simple formula. The formula is: HealthRemaining/HealthTotal*100

You may recognize this formula from calculating how badly you failed your math test in school. So, you will have a number that is your remaining health, and devide that number by another that is how much health the character has total. Simple enough. Now make your health Bar. now you will use_xscale with the percentage formula. The entire line will read:

this._xscale= HealthRemaining/HealthTotal*100

Now your health bar will scale down according to how much health you have. Here is an example of a full working code:
onClipEvent (load) {
total = 100;
remaining = 100;
}
onClipEvent (enterFrame) {
this._xscale= remaining/total*100
}

To change the percentage you will minus or plus from the remaining health. Here is a working file:

Good topic. Often asked, and well-explained, with nice use of reference to other topics.

I was playing with this a few months ago, since it seems to be quite a popular question, and worked out this thing (swf). I can't be bothered digging into it, or creating an explanation, but feel free to download and dissect the .fla file from here (MX version).

setShield() does two things:
1. Sets the recharge bar to the desired percentage.
2. If the bar is in the middle of recharging, it stops it and resets the timer, so the bar isn't recharging while the player is getting hit.

Inglor you make all these tutorials but you never include any examples. Whats up with that? You should consider making samples for your future tutorials as it will make them 10x better (and will also make you better).

Anyways I've been working on a game with a healthbar and the bar uses very few lines of code so I may as well share it:

This works on chrono who has 100 health so if you're character has more/less than that you'll need to make a few very small changes. Hopefully I can get the tile engine working before too long and make this into a full length game. Enjoy!

At 7/26/05 12:44 PM, Lordfat wrote:
Inglor you make all these tutorials but you never include any examples. Whats up with that? You should consider making samples for your future tutorials as it will make them 10x better (and will also make you better).

you're missing the point... I'm not making these tutorials for myself, or to improve myself, I already know all this basic shit for over 3 years... I'm making these tutorials to make this forum cleaner of spam, and for us to have better answers to newbs when they ask questions, for example if a n00b asks how to make a health bar, or some sort of bar, there is no need for example (since the person refered knows what he wants), as for people who click on stuff on AS: Main , I have full faith in their understanding

And this is an open source project, noone is forbidding you from adding content, or submitting this thread modified and linking to if from here, or better, just adding more and more stuff to it here like you're doing... tnx for doing that.

as easy as the "gotoAndPlay" scripting is, i am having difficulty. I made a health bar, I want it to go to another frame when you die, but whenever it goes under, it just keeps going. I put a trace in just to make sure everything is right, and everything is so far. Help please.

yeah um i want the bar to only take off of the right and u said to add this ._x=baseX+this._width/2 but where? here doesnt work:
onClipEvent (enterFrame) {
this._width = _root.score._x=baseX+this._width/2;
}

At 9/2/05 09:22 PM, icpfreek wrote:
yeah um i want the bar to only take off of the right and u said to add this ._x=baseX+this._width/2 but where? here doesnt work:
onClipEvent (enterFrame) {
this._width = _root.score._x=baseX+this._width/2;
}

you would have to change it and put it as:
onClipEvent(load){
//script
}

as easy as the "gotoAndPlay" scripting is, i am having difficulty. I made a health bar ,I want it to go to another frame when you die, but whenever it goes under, it just keeps going. I put a trace in just to make sure everything is right, and everything is so far. Help please.

I had the same troubles too. the problem is that it is on the onClipEvent(enterFrame) effect. but if you have it on onClipEvent(load) it wont check for it automatically. its hard to figure out. i posted a post like this ages ago and i was told to change my whole actionscript for the health bar. i just thought of a way but im not sure if it will work: make a blank mc with 2 frames. and in each of the frames have a frame action like this:
if (health._xscale<0){
tellTarget("/"){
gotoAndPlay("lose-message")}}
else if(opponent-health._xscale<0){
tellTarget("/"){
gotoAndPlay("win-message")}
}
have that in both frames of the mc and it should repeat and check for those variables every frame so when you reach 0 it will goto and play the lose/win message