Making a Pictorial Life Count

Some games that have life counts just take the multiplier approach: “life x 3” displayed on the HUD. On the other hand, some games like to represent lives remaining as a quantity of pictures on the screen. If you have four lives remaining, then draw four life counters on the HUD. In this tutorial, I’m going to walk you through how to do that. Despite using some drawing blocks, it’s not that painful!

Step 1 : Initial Set-Up

First and most obviously, you need some kind of actor to represent your life count on screen. Make sure you set the actor to a couple of things:

  • Set actor’s collision group to “Doodads”
  • Set actor’s general physics to “Cannot Move”
  • Make sure the actor is “Always Active” so that it can still draw properly when off screen; you can use the “Always Simulate” premade behavior to accomplish this.

Next, I am going to assume that life count is going to persist from scene to scene, so we will want to establish a game attribute to store our life count. Make a number GA and call it whatever you like.

Step 2 : Behavior Set-Up

Next we are going to make a behavior to stick on our life count actor. Call it something like “Display Lives”. You will want the following non-hidden attributes:

  • GA Name (Text): The name of the game attribute storing your life count.
  • X Origin (Number): X-coordinate of the first life counter object to be displayed
  • Y Origin (Number): Same as X Origin but for your Y.
  • X Offset (Number): The distance in pixels you want the second count object to be spaced from the first, the second from the third, and so on and so forth.

When you attach the behavior, fill in all attributes to your liking.

Step 3 : Drawing The Life Count

Cool. So let’s draw the life count on screen, shall we?

Let’s add some stuff to our behavior. Now, we are actually going to use the lagless actor method to draw our life count; it will be better for performance in the long run and, frankly, actually makes our life easier anyway instead of having to create and kill actors as we add and remove lives. So add a “When Created” event listener to the behavior and tell it to hide the sprite of the actor (block is found under Actor >> Draw).

Now add a “When Drawing” even listener. What we want to do is simple: draw as many life objects as we have lives left. Therefore, we will use a loop that draws one object per run and runs for as many lives as we have. So grab a “repeat x times” loop (found under Flow >> Looping) and have it reference our game attribute, like so:

Life Count 1

This way, when life count changes on the fly, we don’t have to worry about the behavior having to update an attribute local to only that behavior.

So far, so good. Finally, each time the loop iterates, it’ll draw one of our life objects. We will use the draw sprite block (found under Drawing >> Basic) to accomplish this. Go ahead and put this inside the loop wrapper now. However, for drawing this way, we have to manipulate the “pen” to draw our objects in certain positions. You want to put down two pen movement blocks (found under Drawing >> Transforms), and they will go in the following positions:

  • Before the loop at the beginning of the “When Drawing” event listener, move the pen TO our X Origin and Y Origin.
  • Inside the loop and after the draw sprite block, move the pen BY the X Offset for X and by 0 for the Y. This will prepare the next life object for drawing (if there is one; nothing bad happens if there isn’t though) on an offset from the previous one.

Insert those, and:

Life Count 2

What your finished behavior should like. Again, pay attention to whether or not your pen block is moving “to” or “by”!

Congrats! Your behavior and actor are ready to go. Just make sure you have some method to spawn the display actor in scene. Just once though; the whole point of drawing the image from one actor is so that we don’t have multiple display actors floating around and hurting performance! Note too, that you could easily change X Offset to Y Offset in your attributes and make the appropriate changes to the second move pen block.

That wasn’t so bad, now was it? Heh. Happy Stencyling!

Advertisements
Posted in Stencyl

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: