Making a Flash game like Plants Vs Zombies – Step 5

After a little pause, here we go with the 5th step of the tutorial.

In this step we’ll fix a bug which allowed plants to fire even if there isn’t any enemy coming from the right side, when there’s at least one enemy on the left side, and we’ll see zombies attacking the plants.

First, let me explain some changes: during previous steps, zombiesArray array was used only to count the number of zombies walking in each row. This information isn’t enough for us to know whether the zombies are on the left or on the right side of each plant, so from now on zombiesArray is an array of arrays filled with the names of the zombies walking in each row.

You’ll understand this feature better when we’ll discuss the source code.

To make zombies attack plants, we must stop them once they are on the same tile the plant is placed on.

Let’s see the source code:

In setupField function note how zombiesArray becomes an array of arrays, with one element for each row:

Then in newZombie function in zombiesArray we push the name of the zombie in the appropriate element according to zombie’s row:

Now the whole process of determining if a plant can fire is a bit changed:

We are now scanning zombie by zombie in the same row the plant is placed on, looking for a zombie on the right of the plant (line 214).

Zombies now can attack with these simple lines:

We see if there is a plant on the same tile the zombie is walking on, and if true the zombie stops walking and starts draining plant’s life (alpha channel in this case).

This is the result:

You should know how to play. Try to get your plant killed by a zombie.

Download the source code. Next time, it will be interesting to describe attack waves and show real energy bars.

  • GOOD!!! :) :)

  • Sweet – thx for another great article!

  • TLa

    very good thanks I’ve been learning as2 to as3
    from you so yeah I owe you real much, but how do you make different plants ?
    Thanks
    }i live in a country that thinks that flash can only be used for animation:(.sothanks}

  • Pingback: Daily Digest March 23rd()

  • anyone know how to solve the problem of focus out of the flash player and enterFrame?

  • Looks cool!

    One bug is the ‘gold’ landed on the same tile as one of the ‘plants’ that had been damaged, and the gold couldn’t be clicked (because the plant is probably in front of it).

    Looks really cool with the alpha channel ‘draining’! The first few series inspired me to make a couple games (a PvsZ tower defense style game, and another defense game)

    Thanks!

  • Kirtimaan

    One minor issue with is that you can place a plant just over a moving zombie. And that stops zombie immediately.

    Other than that, great article as always. Waiting for next step :)

  • I’m really excited about creating games have always been an interest of mine. I know flash as far as animation is concerned but I haven’t created a game. I will buy your book.

  • Emad

    Thanks a lot…

  • This is a very good tutor!
    But you write too slowly.It make me crazy!
    Can you write more faster?

  • 888888Zombies

    Two thing.
    1.PLEASE,just PLEASE make part 6!
    2.How to add another working plant in the seed slots?
    Nice job!

  • TigerGeek

    Good job!!
    and like how 888888Zombies say, please make part 6,7,8,9…
    It’s really a good website. When i saw it, i’ve to love it! You are a genius, man!

    And i found a big bug.. like Chris Moeller comment, these plants are in front of the sun, so i always can’t
    click them.

    Please make part 6,please,please~

  • Hari Krishna

    How do you set values for a different plant and values for a different zombie.

  • 888888Zombies

    Thanks to mention my name TigerGeek :3
    :D

  • Kerekmanz

    Desperately in need for the next part, really appreciate it if you’re reading this, tq

  • wolfgang

    Hi emanuel,

    thanks for a good tutorial and for being an inspiration for us. im just wondering if how can i tweak the code to make an instance of a new bullet when fired by different characters. i have 5 characters and i want each of them to fire different bullets each characters?

    on the onEnterFrm() function the code was:

    for (i = 0; i < bulletContainer.numChildren; i++) {
    var movingBullet:bulletMc = bulletContainer.getChildAt(i) as bulletMc;

    i want the function to create a new bullet when character is placed on the grid something like
    var movingBullet:bulletMc = new bulletMc(); //this doesnt work

    currently i managed to create instance of a bullet when a character is clicked but then bullet will change when another character is clicked.

    thanks and more power

  • wolfgang

    Hi emanuele,

    thanks for a good tutorial and for being an inspiration for us. im just wondering if how can i tweak the code to make an instance of a new bullet when fired by different characters. i have 5 characters and i want each of them to fire different bullets each characters?

    on the onEnterFrm() function the code was:

    for (i = 0; i < bulletContainer.numChildren; i++) {
    var movingBullet:bulletMc = bulletContainer.getChildAt(i) as bulletMc;

    i want the function to create a new bullet when character is placed on the grid something like
    var movingBullet:bulletMc = new bulletMc(); //this doesnt work

    currently i managed to create instance of a bullet when a character is clicked but then bullet will change when another character is clicked.

    thanks and more power

  • Just curious if you will be doing Step 6 or a finished version; I have followed it up to this step (5) … thanks great stuff!!

  • Steven Cyprus

    I really enjoy your tutorial,

    You do a fantastiv job, well done.

    The thing is that we like ti see the next part ……

    Keep the good work

  • Su

    Hey Emanuele! Really enjoyed the game tutorial. I was wondering though what the the Plants vs. Zombie game may do for its level transition (ie. using an XML file and a GameManager that changes the scene depending on whether the level is won or lost). I don’t need all the coding, just a basic concept of level transition would help.

    Thanks!

    Su

  • Jin

    Hi, I know this article’s now 2 years old.

    Will you still continue to make this tutorial? Anyway thanks for all that you’ve done so far.

  • Diego GT

    More than a year and part 6 isnt alive yet… whats wrong?

  • Nikita(Founder)

    I found how to add your plant
    u need to find this lines:
    private var money:uint=0;// amout of money owned by the player
    private var moneyText:TextField=new TextField ;// dynamic text field where to show player’s money
    private var playerMoving:Boolean=false;// Boolean variable to tell us if the player is moving a plant (true) or not (false)
    private var totalZombies:uint=0;//total amount of zombies placed in game
    public function Main():void {
    setupField();// initializes the game
    drawField();// draws the game field
    fallingSuns();// initializes the falling suns
    addPlants();// initialized the plants
    addZombies();// initializes the zombies
    addEventListener(Event.ENTER_FRAME,onEnterFrm);
    }
    there u need to add name of your new function (new plant)