App Inventor Tutorial 4 Cat & Mouse Game

Transcription

1 App Inventor Tutorial 4 Cat & Mouse Game This is an app that will let you get familiar with using image sprites, canvas, sound, clock and the accelerometer (Movement Sensor) within a Game in App Inventor. In this app you will control a mouse by tilting the screen. There will be an energy bar on the screen which will decrease over time. The mouse will chase and eat cheese to prevent the energy from running out. You also need to watch out for the Cat, who really wants to eat the mouse. Step 1: New Project on App Inventor Once you have the App Inventor running type into your browser You will get the app Inventor page which looks like this (if you have followed the other tutorials showing the App that you completed last). Click on My Projects.

2 You will get all the projects that you have created listed and there will be options at the top of the screen. In this case we want to create a new project. You will then be presented with a screen where you can type the project name. This project is called CatAndMouse. *Note: As the text box is small it will not show the full name of the project. Step 2: Build the Interface of Cat & Mouse The Cat & Mouse app needs 9 components. Component Type Palette Group Components Name Purpose Canvas Basic FieldCanvas Playing the field. Image Sprite Animation Mouse User-controlled player. Orientation Sensor Sensors OrientationSensor1 Detect phone s tilt. Clock Basic Clock1 For counting down. Image Sprite Animation Cheese The mouse s prey. Image Sprite Animation Cat The mouse s predator. Canvas Basic EnergyCanvas Display mouse s energy. Button Basic RestartButton Restart the game. Sound Media Sound1 Purr when cat eats mouse. Let s start by naming our application. In the properties panel change the name of our screen to Cat & Mouse You will notice this changed the name of our app here

3 Now you are ready to start adding the media items to the project. In order to add media click Add in the Media section below Components. You will see a screen giving you the option to Browse and find the file on your computer, click this. On this screen you can browse to the directory that the media files are contained in. Click on the media file and then click Open. Then click OK on the screen (similar to below). This will add the file to your project. *Repeat this step for the files: Cat, Cheese, DeadMouse, meow and Mouse* Once all 5 media files (4 images, 1 sound) have been added you will see them listed on the media section below components.

4 The next task is to add a canvas to the screen. Under the Basic Palette drag Canvas to the screen. You will see Canvas1 appear on the components list. We would like to rename this component to FieldCanvas so to do this click Rename. This will open a box with the title Rename Component. Type the new name and press Ok. You will see the name of the canvas has now changed on the components list. The next thing we need to do is the set the height and width of the canvas. This can be completed by clicking on the textbox below Width in the properties panel. For Width you should choose Fill parent which means the whole width of the screen. For Height you should select Pixels and type 300 in the textbox. Once the Height and Width has been set you should see a screen similar to below: The next thing we will want to do is add the images to the Canvas.

5 In the Palette under Animation you will see an option for Imagesprite. Drag this on to the canvas, it doesn t matter where you place it as long as it is within the Field Canvas we added earlier. Rename this Image sprit to Mouse using Rename in the components panel. Next we need to add an image to the sprite. Since this is called Mouse we will add the image of the Mouse (Mouse.png). In the properties window you will see Picture, select the text box below this. This will give you a list of all the media items in your project. Select Mouse.png and click Ok. You should now see the mouse image on the canvas.

6 Your screen should now look like this. You will notice there are other properties listed for an image sprite. Below I will give a basic explanation of these. Interval This will be set to 10 (milliseconds) for this game. The number represents how often the image sprite should move itself. Heading - This specifies the directions in which the image sprite should move (in degrees). E.g. 0 will specify right, 90 will specify up and 180 will specify left. Leave this at 0 for now; we will change it later in the Blocks editor. Speed This specifies how many pixels the image sprite will move each Interval. If the number is low it will be slower, if it is high it will therefore be faster. We will set the speed property in the Blocks editor later. The next step is adding the Cheese to the Field Canvas. The Cheese should flit around the Field Canvas, if the Mouse runs into the Cheese (thereby eating it) the Mouse s energy level will be increased. The cheese should also disappear as it has been eaten. It will be replaced by another piece of cheese later in the game. In the same way as adding the Mouse to the Canvas earlier drag the ImageSprite (Under Animation) on to the canvas. Then rename this image sprite to Cheese. In the properties panel you will see an option for Picture, click the textbox below this and select Cheese.png from the list. This will put the Cheese image on the canvas. The next option to change is the Interval Property (in the properties panel), this will be set the same as the mouse (10 Milliseconds). The speed will also be set to 2 so it will not move very fast (to give the mouse a chance to catch it). The Heading property will be set in the blocks editor so there is no need to change it at this point.

7 Now we have the Mouse and Cheese image sprites added to the canvas. The next image sprite to add is the Cat. In the same process as above, drag the ImageSprite (Under Animation) on to the canvas. Then rename this image sprite to Cat. In the properties panel you will see an option for Picture, click the textbox below this and select Cat.png from the list. This will put the Cat image on the canvas. The Interval for Cat will be 10 Milliseconds (the same as the others) and the Speed will be set as 1 (This will allow the mouse a fair chance to catch the cheese). Now that all the Image Sprites have been added to the screen it is time to add more components. The first of these is the OrientationSensor. This will detect if the screen is being held in a landscape or portrait position by the user. Under Sensors in the Palette drag OrientationSensor on to the screen. It will appear as a Non-visible component below the screen. There are no properties to be set for the OrientationSensor as it will be used later in the codes block to determine the direction in which the Mouse should move.

8 The next component that will be added to the game is a Clock. This will also appear in the Non-visible components section below the screen. Under the Basic Palette you will see clock, drag this on to the screen. It will then appear just under OrientationSensor1 that we have previously added. In the properties panel set the TimerInterval to 10 (Milliseconds). You should now have a screen similar to the one below: The next component we will add to the project is the sound file. When the cat eats the mouse a sound will be played. In order for this to happen we need to add the sound component. Under Media in Palette you will see Sound. Drag this on to the screen and it will appear as a Non-visible component like the Clock and OrientationSensor. Set the source of Sound1 to the meow.mp3 file that we added earlier in the tutorial.

9 There must be an energy bar showing the amount of energy the mouse has got left (warning of starvation). We can do this by creating a new canvas. Under Basic in Palette select Canvas and drag it below the FieldCanvas. Rename this canvas to EnergyCanvas. Set the Width of this canvas (in the properties panel) to Fill Parent and Height to 1 Pixel. The end result should look like the screen below: The final component that we will need to add to the screen is a Restart button. Under Basic on the Palette select Button and drag it under the EnergyCanvas. Rename this button to RestartButton and set the text value of the button to Restart. You can also set the width of the button to Fill Parent to allow it to be clicked faster during game play. These options along with other can be found in the Properties panel.

10 Step 3: Add the functionality to the Interface Once the interface is ready we can set the functionality of the components. What we want to happen can be described in the following steps: 1. The cheese and cat will move around the screen. 2. The mouse will be controlled by the user tilting the screen and changing the screen orientation. 3. The mouse will run out of energy (starve) when time runs out. 4. The mouse will be able to eat the cheese to add more energy. 5. Sound will play when the cat eats the mouse (meow sound). The functionality of the program (step 3) is added by using the Blocks Editor - Along the top of your App Inventor panel you will notice a button which says 'Open the Blocks Editor'. Click on this button You will now be asked would you like to open the code blocks file, click Open. The Java Environment will load. You will probably see this image for a few seconds The Blocks editor will then load. This process may take a few minutes so please be patient you will see a screen like below when it loads.

11 The first thing we need to do is create a procedure for updating the position of the mouse. This will be then called by the clock timer (every 10 milliseconds). To do this go to the blocks editor click Built-In and you will see a list of blocks. First we will click Definition and drag the procedure block to the right (into the workspace). This will allow you to add actions to be completed within the procedure. Name this procedure UpdateMouse as it will be called within Clock1.Timer In the blocks editor click My Blocks and you will see the list of the blocks in your app again. Now we will click Mouse and drag the Mouse.Heading block to the right (into the workspace). This will allow you to add the action to the procedure. Now go back to My Blocks and select OrientationSensor1. Drag OrientationSensor1.Angle to the right of Mouse.Heading and this will set the Mouse Heading to the current Angle of the phone s orientation. It should look like the block below: In a similar way as above we should also set the Mouse.Speed value to OrientationSensor1.Magnitude multiplied (*) by 100. *Note: Multiplication can be found in Built-In then Math. you can get Number from the same place, you just need to type 100 When the UpdateMouse function is complete it should look like below: Remember also that

12 Now we have the Clock1.Timer event in our workspace to call this procedure. This can be found in My Blocks and then select Clock1. The Timer block will be the first on the list and should look like below: In the blocks editor click My Blocks and you will see the list of the blocks in your app again. Now we will click My Definitions and drag the UpdateMouse block to the right (into the workspace). This will allow you to add the action to the Clock1.Timer event. We need to keep a track of the Mouse s current energy levels, to do this we will need to keep a variable of the current energy level. Go to Built-In (in the blocks editor) and click Definition. Drag def Variable to the right (into the workspace). Rename the variable to energy. Now connect the number 200 to give energy an initial value. This can be done by selecting Built-In and then Math (Drag the block to the workspace and connect it to energy). Change the number to 200 and this will assign the initial value. Now Energy has an initial number, we need to find a way of turning this into the energy line on the game. To do this we need to create a procedure to draw a coloured line. Go to the Definition section in Built-In and drag the Procedure block on to the workspace. Rename the procedure (which is currently called Procedure) to a more meaningful name such as DrawEnergyLine. This procedure will have to take two arguments (colour & length) as the same procedure will be used in a few different places. To pass arguments into the procedure go back to the Definition section and drag name on to the workspace (to connect to the arg on the DrawEnergyLine block). Rename this from name to colour. The other argument you need to connect to DrawEnergyLine is Length, connect this the same was a colour but rename it to Length.

13 Now that you have the arguments set up you need to add functionality to your procedure. The first thing we are going to set is the PaintColor of the canvas. To do this go to My Blocks and select EnergyCanvas. Now drag EnergyCanvas.PaintColor (the set to block) and connect this to the procedure. This is where we will use the colour argument that is passed into the procedure. In My Blocks you will see a section called My Definitions. In this section drag the Colour value and connect it to EnergyCanvas.PaintColor. Next we need to call the DrawLine function, again go to My Blocks and select EnergyCanvas. Drag EnergyCanvas.DrawLine and drag it to below the EnergyCanvas.PaintColor block. In order to use the DrawLine function we need to pass 4 numbers (x1, y1, x2, y2). For x1, y1 and y2 we will be setting this number to 0. To do this go to Built-In and under Math you will find the Number block, drag this to each of x1, y1 and y2. Set the value (which is currently 123) to 0. For y1 go back to My Blocks and under My Definitions you will find the value Length. Drag this to y1. - This procedure is now ready to be used - 13

14 Now we can create the next procedure, this new procedure will use the procedure we just created within it. From Built-In select Definition and drag the procedure block on to the workspace. Name this procedure DisplayEnergy. Now go to My Blocks and under My Definitions you will see the function we created earlier DrawEnergyLine. Drag this on to the workspace and connect it to DisplayEnergy. Now we need to pass arguments into the procedure, this can be completed by dragging these on to the workspace and connecting them with DrawEnergyLine. Firstly we want to set a colour; go to Built In and under Colors you will see Color White on the list. Drag this colour and connect it to DrawEnergyLine where it is expecting the colour parameter. For the Length argument we would like to pass the width of the EnergyCanvas. This can be completed by going to My Blocks and EnergyCanvas then dragging EnergyCanvas.Width (not the set procedure). This is to be connected with the length argument, see below. Now we are going to re-use the DrawEnergyLine procedure and drag it below the one we just set up. Drag the procedure into DisplayEnergy and you will see it looks similar to above. Instead of dragging the colour White as an argument, for this procedure we will be using red. For the Length on this procedure we are using the Energy variable that we set up earlier in the tutorial. To get this go to My Blocks and under My Definitions you will see energy. Drag this variable and connect it to the length argument. 14

15 The next piece of functionality we are going to add is the GameOver procedure. From Built-In select Definition and drag the procedure block on to the workspace. Name this procedure GameOver. Under My Blocks you will see Mouse, within this there is a Mouse.Enabled. Drag the set to command across to the workspace and connect it to GameOver. We need to set this to false so to find this go to Built-In and then Logic. You will see false, drag this to the workspace and connect it to Mouse.Enabled. We also want to change the picture of the mouse to a picture representing a dead mouse. To do this go back to My Blocks and under Mouse you will see Mouse.Picture as a set to command. Drag this below the Mouse.Enabled block. Now to add the name of the file, go to Built-In and click Text. You will see a text block with the word text written on it. Drag this to the workspace and connect it to Mouse.Picture. Rename text to DeadMouse.png. It is important that you write this in the exact case used as it refers to an image file we added earlier. Now we can add more to the UpdateMouse block. First we will add energy, this can be found in My Blocks under My Definitions. Drag the set to command on to the workspace and put it above Mouse.Heading. We want to set the energy level to 1 less than its current value. To do this drag the minus block (Found in Built-In under Math) on to the workspace and connect it to energy. 15

16 Now drag the variable energy to the first missing section on the minus block. This can be found in My Blocks under My Definitions. Now connect the number 1 to give the amount that is decremented each time. This can be done by selecting Built-In and then Math (Drag the block to the workspace and connect it to the second missing section on the minus block). Change the number to 1 and this will reduce energy by 1 every time this procedure is run. The next procedure we want to call within UpdateMouse is DisplayEnergy, this will display the energy bar on the canvas. This can be completed by going to My Blocks and under My Definitions selecting the call function for DisplayEnergy. Now we need a test to check if the mouse s energy level is 0 (Starvation) so we can call the GameOver procedure. To do this we need to drag an if then do block into the UpdateMouse procedure. This block can be found in Built-In under Control. Drag it on to the UpdateMouse block below DisplayEnergy. 16

17 The test that we will use in the if block is if energy is equal to 0. This can be completed using an equals block. The equals block can be found in Built-In under Math. Drag this block to the workspace and connect it to test on the if block. Now drag the variable energy to the first missing section on the equals block. This can be found in My Blocks under My Definitions. Now we need to add the number 0 to the equals block. This can be found in Built- In under Math. Drag the number across and change it from 123 to 0. The final piece of functionality we need to add to the if block is to call the GameOver procedure if the test is positive. This can be done by dragging GameOver from My Blocks under My Definitions. Make sure the call for GameOver is in the then-do section of the if block. 17

18 Now we will create a procedure to update the cheese to ensure it is moving about the screen. To do this go to the blocks editor click Built-In and you will see a list of blocks. First we will click Definition and drag the procedure block to the right (into the workspace). Rename this procedure to UpdateCheese. There will be another if then do block used within this procedure so drag this type of block from the Built-In section under Control. Drag this on to the UpdateCheese block. In the test we will need a less than operator (<); this can be found in Built-In under Math. Now in the same section (Math) you will see a function for random fraction, this is to ensure that the cheese changes direction 20% of the time. This next part is where we set the percentage; this number function can be found in the math section also. Change the number to.2 (20%) - *It is important to put the point before the 2. Under My Blocks select Cheese and drag Cheese.Heading (set to) on to the then-do block. This is what you want to be completed 20% of the time (when the test is positive) 18

19 Drag Random Integer from the math section (In Built-In) and connect it to Cheese.Heading. The numbers will initially be from 1 to 100, change these numbers to 0 and 360, see the example below. Now this procedure has been created we can add this to the timer. Go to My Blocks and under My Definitions you will see call UpdateCheese. Drag this into the timer block. Now we are creating a new Procedure called EatCheese, this will be called when the mouse collides with the cheese. The procedure block can be found from Built-In under Definition. Name this procedure EatCheese. Within My Blocks under My Definitions you will notice the set global energy to function. Drag this on to the workspace and connect it within the EatCheese procedure. Once the Mouse collides with the Cheese we want this to boost the Mouse s energy. To do this we need to use the addition block found under Built-In Math functions. Drag this to the workspace and connect it to energy. Now we want to take the original value of energy in order to increase it. This is found in My Definitions within My Blocks. It is called global energy. 19

20 The Energy level will be increased by 50 each time the mouse eats a piece of cheese so we put the number (found under Built-In within Math) 50 into the addition block. We also want to change the visibility of the piece of Cheese as we no longer want to display it on the screen. Under Cheese in My Blocks you will find set Cheese.Visible to, drag this into the EatCheese procedure. In Built-In under Logic you will find false, drag this into the workspace and connect this to Cheese.Visible. This will ensure that the image of the piece of cheese is no longer displayed on the screen. We also want to disable the piece of cheese so in order to do this we perform similar steps to above. Go to My Blocks and under Cheese you will find set Cheese.Enabled to ; drag this on to the EatCheese procedure. We want to set this to false, so drag false (under Logic in Built-In) on to the workspace and connect it to Cheese.Enabled. 20

21 We want the Cheese to move so when it is put back on to the screen it is no longer in the same position. To do this we are using Cheese.MoveTo found in the Cheese section under My Blocks. In the Math section (under Built-In) we have the option to use a random integer, drag these to the x and y co-ordinates for the Cheese.MoveTo function. Delete the to for each which will be 100 by default. (By dragging to the bin or pressing the delete button). Drag the minus function from Built-In under Math and connect it to to on the random integer generator. 21

22 For the first Random Integer we are using FieldCanvas.Width (under Field Canvas in My Blocks) and for the second part of the minus block we are using Cheese.Width (under chees in My Blocks). Follow the instructions above for the second random integer generator. However, instead of Width use Height. Under Mouse in My Blocks you will find a procedure called Mouse.CollidedWith. This function will run when another image sprite (Cheese or Cat) runs into the Mouse image sprite. Drag this procedure on to the workspace. We will need an if then do block within the procedure, you can get this from the Built-In section under Control. Drag this to the Mouse.CollidedWith block. 22

23 For this if block we want to use multiple tests together, to do this you can use an and block. This block can be found within the Built-In section under Logic, drag this to the test connection on the if then do block. For the first test we will be using the equals block, this can be found in the Built In section under Math. Drag this to the connection with the first test on the and block. You will be using the argument (other) value in this test; this can be found within My Blocks under My Definitions. Drag this block to the first gap on the equals block. We are comparing the other value with the Cheese component (this can be found under My Blocks in the Cheese section). Drag this into the second gap. On the next test we want to check if the Cheese picture is showing on the screen, to do this go to My Blocks and under the Cheese section you will see Cheese.Visible. Drag this on to the next test connection. The result should look like below: 23

24 Finally we would like to set what happens if each of these tests are true, in this case we would like the mouse to eat the cheese. To do this you can find Eat Cheese under My Definitions in My Blocks. Drag this to the then do section of the if block. Now we will return to the UpdateCheese procedure that we created earlier. Drag an ifelse then-do else-do block from Control under Built-In. Put this block between the if then-do and the procedure, see below: In the test for the ifelse block we want to check if the Cheese is visible on the screen. To do this we need to drag to Cheese.Visible block from the Cheese section under My Blocks and connect it to the test. Now drag another if then-do block in the else-do section. See highlighted below: 24

25 The test for the if then-do block is a < (Less Than) test. The less than block can be found in the Built-In section under Math. Drag this to the test connection. In the first gap place random faction (found in Built-in under Math) and in the second gap place the number.05 (5%). This is also found in the Built-In section under Math. So 5% of the time when Cheese is not visible we want to display Cheese again. To do this go to My Blocks and under Cheese you will find Set Cheese.Visible to. Drag this into the then-do section. You will also need to drag true from the Built-In section under Logic and connect it to Cheese.Visible. 25

26 Similar to the instructions on the previous page we are setting a value to true but in this case it is Cheese.Enabled, this can also be found under Cheese in My Blocks. The restart button should allow the user to restart the game, to do this go to RestartButton under My Blocks and drag RestartButton.Click on to the workspace. Now we can drag set global energy to (from My Definitions) into RestartButton.Click. The function (set global energy to) needs an argument, this is what you are setting energy to. In this case we are setting it to 200. To do this drag a number function from the Math section under Built-In and change the number to 200. We would also like to set Cheese to Visible, under Cheese in My Blocks you will find Set Cheese.Visible to, drag this on to the block. You will also need to drag true from Logic under the Built-In section. Then will set the cheese image to be visible on the screen. 26

27 Similar to the instructions on the previous page we are setting a value to true but in this case it is Cheese.Enabled, this can also be found under Cheese in My Blocks. Following the example above we are setting Mouse.Enabled to true in the same way. Under Mouse in My Blocks you will find Set Mouse.Picture To, drag this on to the Restart Button block. You will need to set the name of the picture you would like to set it to. To do this drag a text block from the Built-In section under Text. Change the name of the text to Mouse.png. (Ensure you type this with a capital M as it is case sensitive). The next procedure we will be working on is going to be called UpdateCat. Drag a procedure block from Control under Built-In and rename it to UpdateCat. Drag an if then-do block into this procedure block. 27

28 The test that we will be using in this procedure is a < (Less than) block similar to the one we used earlier in the tutorial. In the first gap in this less than block drag random fraction from the Math section under Built-In. The second gap will be filled with a number (also under the math section). Change this number to.1 which represents 10%. (See below). In the then-do section you can change the direction the cat is moving towards. In My Blocks under Cat you will see Cat.Heading. Drag this to the then-do section. There is a built in function called atan2 that we will be using to change the direction of the Cat. This function can be found in the Math section under Built-In. Drag this function on to the workspace and connect it to Cat.Heading. Drag the minus block (found in Math under Built-In) on to both the y and the x connection, see below: 28

29 You will find Cat.Y and Cat.X in the Cat section under My Blocks. You will find Mouse.Y and Mouse.X in the Mouse section under My Blocks. Drag these to the relevant places as seen in the screen shot below: Now the procedure that we just created can be added to Clock1.Timer, to do this drag the procedure from My Blocks under My Definitions and put it into Clock1.Timer. Now we need to work on the case that the Cat eats the mouse. To do this we need to add another if then-do block into Mouse.CollidedWith (from Built-In under Control). We will be using the equals block as part of the test for this if block. This can be found in the Math section under Built-In. 29

30 You will be using the argument (other) value in this test; this can be found within My Blocks under My Definitions. Drag this block to the first gap on the equals block. We are comparing the other value with the Cat component (this can be found under My Blocks in the Cat section). Drag this into the second gap. In the case that the test is true we want to set a new energy level, in order to do this drag set global energy to from My Definitions under My Blocks. Put this into the thendo section in the if block. We need to set the energy variable to a number, in order to do this drag Number from the Math section under Built-In. Change the number to 0. 30

31 After setting the energy level to 0 we will also need to display this on the screen. To do this drag DisplayEnergy from My Definitions section under My Blocks. Put this under where we are setting the energy variable to 0. In the same way as above we should also drag the GameOver procedure into this block. Within the Restart button we need to change the position of the Mouse as we are starting a new game. To do this drag the Mouse.MoveTo function from the Mouse section in My Blocks on to the RestartButton.Click block. 31

32 In this case we are also making use of the random integer function (found within the Math section under Built-In). Once this has been dragged on to the block and connected to x we should change one of the numbers from 1 to 0. We should also delete the to number by pressing delete or dragging it to the bin. We are instead going to use the minus block to work out the maximum number. This can be found in the Math section under Built-In. Under FieldCanvas in My Blocks you will see FieldCanvas.Width, drag this to the first gap in the minus block. In the second gap drag the Mouse.Width value from the Mouse section under My Blocks. 32

33 For the y section on Mouse.MoveTo please follow the instructions from the previous page but replace Width with Height. Now we are going to add sound and vibration. When the Mouse eats a piece of cheese there should be a vibration. To do this go to the Sound1 section under My Blocks and drag Sound1.Vibrate into the EatCheese block. We need to set a number of milliseconds that the vibration runs for, to do this we need to use number which can be found in the Math section under Built-In. Drag this number to connect with Sound1.Vibrate and change the number to

34 Finally, go back to the Sound1 section under My Blocks and drag Sound1.Play out and insert it into the bottom of the Mouse.CollidedWith block. This will give a meow sound when the Cat has eaten the Mouse. That s it, the app is now ready for you to test it.

35 Step 4: Try it out Connect to the device and test the program In order for us to test to see if our Cat & Mouse game works we can set up an emulator this is a little on screen phone which acts like a real phone that allows us to test the app. We create a new emulator by clicking on the New emulator button at the top of our blocks editor. The following window will appear. This tells you that it will take a few minutes for the emulator to load. You must wait for the emulator to load fully before you test your app. Read this then Just click OK. Once the emulator is ready (that is when you have unlocked it and followed the above instructions) you can connect and send your app. Select the device from the device list. Click here. The list will populate with the name of your emulator device which is also found on the top of your loaded emulator. Click on the correct device name in this list. *You will notice the app is transferring to the emulator device. You will see the yellow phone appear beside Connect to Device when this changes to the green phone it means the application is ready.

36 Once it has transferred your app will appear on the emulator. Most of the functionality of this app cannot be emulated so to get the full experience it would be best to load this app on to the phone for testing. You have just created a functional Cat & Mouse Game, Well Done End Note: For the Cat & Mouse game we used sounds, images, accelerometer (movement sensors), image sprites and timers. Following these methods why don t you try different sounds and or images? You can also keep track of a score using the same type of variable Remember, if it can be done, the pieces will fit together like a jigsaw otherwise think of another way to try it. ~ Have fun ~ 36