Health Bar Tutorial by Nivram
Beginner-Should have a basic understanding of MMF.
You will learn the following:
We will be doing a Health Bar Tutorial. There will be no extensions required, but you should download the .mfa file so you can follow along, or compare my .mfa file to the one you will be building.
This will be a non-scrolling Application using an active character with "Static Movement". Static means we will not be assigning any kind of movement, and this is the default movement for MMF when you first create an active object. Open up MMF and click New under File. Rename your Application to Health Bar Example. Save as HealthBarExample2. I would like to comment that you should often save any project you are building. Create an Active Object 32X32 and place the Hot Spot to the center. Rename it Character. Place the Character in the Frame. The color you make it does not matter and do not assign any movement. Save your Application.
In the Events Editor and for your first code make a Comment:
Make a Group Event and name it: Movement Set Up
Leave the "Active when frame starts" checked.
Let's make two other Group Events:
Move Right Uncheck "Active when frame starts" Movement Setup Group Events Add these events to the Movement Setup Group Events. They are going to be activating and deactivating the different Move Group Events.
Upon pressing Right Arrow
Upon pressing Left Arrow
We toggle the flag so that if the user presses the Right Arrow Key again it stops the character by turning Flag 1 off.The reason we are deactivating unneeded groups and flags is so that the character doesn't get confused, and move in only one direction at a time.
Save your Application.
Move Right Group Events The first event in the Move Right Group Events will tell the Character if my Flag 1 is on, move me 1 pixel to the right. If my Flag 1 is off, stop me from moving:
Character internal flag 1 is on
The next event will be an expansion event so that if you want to add to your application, the event will be in place. It backs the character out of an obstacle and sets Flag 1 off:
Character overlapping obstacle
You don't want your character to walk off the screen, so add this event:
Character is getting closer than 5 pixels from Window's edge
A word of warning here. If you use an animated character it may become stuck if it turns, as this will place it inside an obstacle or closer than 5 pixels from the edge of your screen. All you need to do is Always set your animated character to the current active you are using for movement, and at the Start of the frame set your current movable active to invisible.
This event tells the program, if the characters internal flag 1 is off, deactivate Group Event Move Right:
Character internal flag 1 is off
This is all the events for Move Right Group Events
Save your application and test it. Your character should start moving right when you press the Right Arrow Key and stop when you press it again.
Move Left Group Events
We will add the events to the Move Left Group Events and they will have your character move to the left.
Character internal flag 2 is on
The next event will be an expansion event so that if you want to add to your application, the event will be in place. It backs the character out of an obstacle and sets Flag 2 off:
Character overlapping obstacle
You don't want your character to walk off the screen, so add this event:
Character is getting closer than 5 pixels from Window's edge
This event tells the program, if the characters internal flag 2 is off, deactivate Move Left Group Events:
Character internal flag 2 is off
This is all the events for Move Left Group Events.
Save your application and test it. Your character should start moving left when you press the Left Arrow Key and stop when you press it again.
We should be done with our simple movement. Your Character should be able to move in two directions, left and right.
Ground
We need some ground. This will give the character the elusion of walking on the ground when it moves. Since our frame is 640 X480, make a background object 640 wide and 20 high. You can make it any color you want. Place this at the bottom of the screen. Since we are using static movement for our character, we don't have to worry about making the ground an obsticle. Name it Ground. Make sure the character is placed on the ground level near the left hand side.
Electric Charge
Now make an active object 5 pixels wide and 40 pixels high. Color does not matter. Place this sticking out of the ground near the middle of the frame. Name it ElectricCharge. This will be used to decrease the health of our character and reduce the width of the health bar.
Health Bar
Now for the Health Bar. Make a new active object, 27X6 (hotspot at center), and rename it HealthBar. Place it out of the frame on the left. In the Animation Editor, in the stopped animation (Right Direction 0), make it look like this:
In the stopped animation, for each direction, erase one bar. Do directions 0, 4, 8, 12, 16, 20, and 24. Direction 24 (down) should look like this:
Your next event, at the bottom of all your events, will be:
This will place the Health Bar above the character no matter where the character is moving to. Save your application.
Subtracting From The Health Bar
Remember the Electric Charge you stuck in the ground earlier? We are going to make so that when the character walks into it, we will subtract one bar from the Life Bar.
Make a Group Event and name it:
Health Bar
Back to the frame editor and add a counter and place it to the left of the frame. Set the initial value to 6, minimum to 0, maximum to 6. Name it HealthBarCounter.
In the Health Bar Group events, add these events:
Counter=5
Counter=4
Counter=3
Counter=2
Counter=1
Counter=0
The next event will direct the counter and direction of the Health Bar as the character touches the Electric Charge.
Character overlaps ElectricCharge
The reason we use "Only one action when event loops" is so that when the character touches the Electric Charge only one will be subtracted from the counter. Otherwise the character would quickly be destroyed.
The next event tells MMF to destroy the character and Health Bar when the HealthBarCounter=0.
Counter=0
Save your application and test it.
I will leave it up to you to code the replinishment of the Health Bar. Basically when you overlap an active object you set the HealthBarCounter to 6.
© 2008-2010 Marvin Hull |
