Making a Flash game like Plants Vs Zombies – Step 4

Welcome to step four. In this step we’ll make plants fire and eventually kill zombies.

Let’s start defining when a plant can fire:

* When there is at least one zombie on the same row the plant is placed
* When it’s not already firing (plants can fire only one bullet at once)
* When a certain amount of time passed since the last time the plant fired

Now let’s define the bullet life:

* The bullet flies from left to right
* The bullet is removed when it hits a zombie
* The bullet is removed when it flies outside the stage

These six concepts bring some great changes in our script, and I tried to organize it in the clearest way possible, while being conscious that putting all the code in a single class starts making the script a bit messy. Anyway, I tried to do my best to keep it readable.

Before showing you the script, you have to say I created a new object called bulletMc which is the bullet itself.

Ready to see an almost 300 lines long code?

If you followed previous steps you will notice I changed a bit the code but the old concepts remain the same.

I will focus on new concepts, starting from the creation of a new array called zombiesArray (line 18) which will store the number of zombies for every row. This is very useful when we want to know if a plant can fire.

At this time the plant can fire only when there is a zombie on its same row, so I don’t care if the zombie is on its left or on its right, but it’s something I will have to face during next step. I don’t want to place a plant on the right of a zombie and see it firing to the right, to an empty row.

When a new zombie is added with newZombie function (line 100) these two lines

assign a zombieRow property to the zombie and increase the zombieRow-th element in zombiesArray array. Thanks to this array, I always know how many zombies are roaming in all possible rows.

In placePlant function (line 170), the function I use to place a plant, I am adding some custom properties:

I want to define the plant fire rate, in frames. It means the plant will fire a bullet every fireRate frames. I’ve chosen to measure the fire rate in frames rather than in milliseconds because if there are too much objects on the stage and the game slows down, the fire rate too will slow down, rather than remaining constant. recharge will be increased at every frame, and when it’s equal to fireRate, the plant is ready to fire. isFiring tells us if the plant is already firing, and plantRow saves the row where the plant is placed, useful when it’s time to check how many zombies are walking in its row.

To see if a plant can fire we use this if statement:

It checks for the plant to be on the same row of at least one zombie, to be fully recharged and not to be already firing. Then a new bullet is created, some properties are changed to tell the script the plant is firing and has to recharge, but above all we need a sonOf property to know which plant fired the bullet. This is very useful once the bullet is about to be removed from the stage and we want to update isFiring property of the plant.

Then the core code for zombie killing management is this for loop:

I am scanning through all zombies performing an hit test to each one, and if a zombie has been hit, we remove the bullet, set isFiring property of the plant which fired it to false and decrease zombie’s energy… the alpha in this case. If the alpha reaches zero, we remove the zombie and decrease the corresponding element in zombiesArray array to update the number of zombies in that row.

At this time you can test the game:

Collect money, buy plants and kill zombies.

Download the source code

Next time, we’ll make zombies attack too, and we will give some environment to the game. No more circles Vs squares, going to make a real game out of it.

  • Wilson Silva

    Sometimes the zombies come in large packs (large like 5 zombies over each other)

  • Arkshija

    it lags???? i think “sun” must be always on the top (not deeper than turrets)

  • MC

    Nice tutorial! Suggestions:
    – You should be able to cancel the “placeplant” process
    – The zombies should attack in (level-controlled) waves

  • Pingback: Tweets that mention Making a Flash game like Plants Vs Zombies – Step 4 - Emanuele Feronato -- Topsy.com()

  • Farzad

    Great !
    I can’t wait for final step !

  • Gwildor

    Hi Emanuele,

    First of: great fan of your work, and been following your blog for years. Weird that this is the first time I comment. I would love to see that you pick up JS + canvas like you did a few months back, but that isn’t something to talk about in this post.

    Second, and the reason I post: you do set the amount of zombies in a row and increase it, but you never decrease it when a zombie dies, resulting in the plants thinking there are tons of zombies on the row while it is empty. This causes them to fire, even tho the row is empty:
    http://i.imgur.com/LVio6.png

    • Emanuele Feronato

      on line 237 I decrease a zombie when it dies. Probably there’s a zombie outside the stage on the left or on the right, otherwise it’s unclear why only some rows have firing plants

  • Great! I wait for your next step :) :)

  • Farzad

    There is a problem : The plants shoot the second fire , only when the first shoot meet the body . They should shoot fires for example each 3 second , but they wait until the first shoot meet and then attack second shoot .

  • I love it.
    I have a homework to make a simple game.. thanks for the tutorial :D

  • jermshar

    I love your tutorals!!!
    please oh please finish this one!!!

    Im waiting for next so i can make my elves attack the poor fairies….

    also how to add more types of plants/(fairies in my case)?

  • Dmitriy

    Excellent!!
    I now understand how the many games that were a mystery to me!

  • Great tutorial. Thanks for sharing

  • dino

    i’m waiting for step 5…. btw, awesome tutorial u make….

  • Diego Garcia

    thanks u so much!
    i realy like u works =D

    please, finish the last part of tutorial /o/
    and if possible, i wanna know how those Tower Defence works.

    weel, tks for everthing =D

  • pshero

    hrmmmph. well almost 2 months and he abandoned this project/tut for some Flash 3d and box2d bs again. like always. just when we were learning something, he cuts it short and goes to something else. A.D.D. anyone? nice tuts but ya gotta learn to finish what you started.

    like how do we get the zombies to attack back?

  • Can´t wait to level up my skills in AS3 to follow this tutorial.

  • Bony Raptor

    Great! I love this tutorial series and can’t wait for the next part! I check back on your blog almost every day. I hope you cover how to make levels get harder, and also add new types of plants. Keep up the great work!

    • Bony Raptor

      I would also like to learn how to make multiple zombies, some with big health, but slow. Others fast, but low hp. Maybe some jumping ones too. I doubt you can cover all this in one tutorial, though.

  • Pingback: Week 11 | Learning Interactive Media()

  • Pingback: ???????????Flash??4 | ?????()

  • Zenith

    emanuele i try to learn from your code but i really don’t get it. why my plant can’t fire like yours. I modify from external actionscript into 1 project with actionscript inside, please help me.

  • likelikelikelikelikelkielikelikekielkielkielkielkiklelkielekielekeki

  • xegnma

    @pshero: Dude, Emanuele does not live to serve you. You have a strong foundation here to get you started. Exercise a little initiative and start expanding on what you already have. You’ll end up a better programmer for it.