RSS

Simple Card Matching Game Tutorial 3

Hi, Today i will teach you how to make the back view.

Simple Card Matching Game Tutorial 3

Remember i asked you to do a back view is a movie clip? Now take that out because we will be using it.

You will have to go in to movie clip mode by double click the card and you will go inside the movie clip mode now. Create 1 more layer and rename the both layer, 1 is front and 1 is back. Back layer is at the top of the front layer. Go to back layer, paste it and cover the card so that people cannot see the inside now. The instance name name it as mcBack1, how many cards mean how many number, if you have 12 the last will be mcBack12. Easy and simple and you will have a cover now.

For a example at below:

Image

Create an array that store the back view movie clips instance name. This might be new to you. First the back view movie clip is inside mc1 so we need to get it by using mc1. This line of code will get the back view movie clip.

mc1.mcBack1

So array it now, it will be LONG.

var bCards:Array = new Array(mc1.mcBack1, mc2.mcBack2, mc3.mcBack3, mc4.mcBack4, mc5.mcBack5, mc6.mcBack6, mc7.mcBack7, mc8.mcBack8, mc9.mcBack9, mc10.mcBack10, mc11.mcBack11, mc12.mcBack12);

We use loop to add the event listener so we don’t need to type 12 TIMES which is a torture to a programmer, Shortcut is everything to us !

for(var j:int = 0; j < bCards.length; j++)
{

bCards[j].addEventListener(MouseEvent.CLICK, openCard);

}

We need a function to open the card so that we can view it ! This line of code is using the target and visible. If the user click on the card the back view is hide from the stage. I said hide not remove, so it’s just can’t be seen and click for now but is at the background of the stage is different from removing.

function openCard(e:MouseEvent):void
{

e.target.visible = false;

}

Overall coding we have done and COMMENT YOURSELF

var bCards:Array = new Array(mc1.mcBack1, mc2.mcBack2, mc3.mcBack3, mc4.mcBack4, mc5.mcBack5, mc6.mcBack6, mc7.mcBack7, mc8.mcBack8, mc9.mcBack9, mc10.mcBack10, mc11.mcBack11, mc12.mcBack12);

for(var j:int = 0; j<bCards.length; j++)
{

bCards[j].addEventListener(MouseEvent.CLICK, openCard);

}

function openCard(e:MouseEvent):void
{

e.target.visible = false;

}

Next tutorial, i will explain timer and event target because is needed for tutorial 5, which will be using it. I must let you understand timer and event target so you will understand why i use it.

FLA Link: http://db.tt/3ksrGib2

Cheers,
Wilson Oh

 

Leave a comment