Introduction
In this chapter, we will make a game which will involve shooting bats using a joystick. Well not exactly shooting, no one wants PETA running after them for no reason; instead we will adopt a more non-violent approach and only aim at bats. They’ll disappear once we correctly aim at them, but hey, at least they won’t die.
Components Required
| IMAGE | COMPONENT | QUANTITY | AVAILABLE IN KIT |
|---|---|---|---|
 | evive | 1 | |
 | XY-axis Joystick Module | 1 | |
 | Male to Female Jumper Cable 20cm | 5 | |
 | USB A-B Cable | 1 |
Building Guide
Step 1: Understanding the Game
Notice the basic elements of the game. Observe that there is a planet in the distance, which is probably Saturn (rings) so we are most probably on some moon of Saturn. Bats on a moon of Saturn? Does life exist in Saturn’s proximity? Strange isn’t it? Could our simple Scratch game discredit years of research by NASA? Boy, aren’t we on the cusp of creating history. Look at the resplendent yellow stars shining against the gloomy Grey sky and before you turn into a nature-loving romantic instead of an innovator, let’s clear things up: WE WERE JUST KIDDING. You can skip this paragraph for what it’s worth.
However scientifically inaccurate the Stage may seem, we’ll have to work with it. The Stage is only for effects and aesthetic purposes; we should treat it as such. The actually important aspects of the game which you should note are:
The Bat Sprite: Just like the Panda sprite (which is default), we can have many other sprites, one of which is the bat sprite. Bats will fly around the stage one at the time and we will aim at them using the Aim sprite, which is another important aspect of the game.
The Aim Sprite: The bats shall fly around randomly but we will have to aim at them using the Aim sprite. We will move the aim sprite using a joystick. When the aim sprite will touch a bat, the bat will disappear.
Score: Your score, i.e. – number of bats you aim correctly at will be displayed at the top left corner.
Timer: Time remaining before the bats stop coming and the game gets over.
The Aim Sprite: The bats shall fly around randomly but we will have to aim at them using the Aim sprite. We will move the aim sprite using a joystick. When the aim sprite will touch a bat, the bat will disappear.
Score: Your score, i.e. – number of bats you aim correctly at will be displayed at the top left corner.
Timer: Time remaining before the bats stop coming and the game gets over.
Step 2: A little about Scratch
Scratch is a graphical programming language which let you interface and control your evive with laptop. If you have not installed Scratch visit here to get full instruction on installing Scratch.
To learn about the Scratch interface, visit here. There are four important things you have to know in Scratch:
We have developed these Scratch extensions containing special blocks through which you can control your evive in Scratch:
- Arduino: These blocks control the basic input, output and communication of evive like digital and analog input/output, serial communication, PWM output, etc.
- evive Inbuilt Functions: Using this block you can control the basic functionalities of evive like tactile-switches, slide-switches, potentiometer,motors, 5-way navigation key, touch inputs and Real Time Clock.
- evive TFT Screen: Using this block you can control the TFT display of evive.
- evive App: Using this block you can communicate with the Mobile App.
- evive Tinkering: These block are used to interface various sensors and actuators.
In Scratch, there are two modes in which you can work:
- Arduino Mode: Under Arduino mode, the instruction blocks will be tranfer to Arduino C++ into Arduino IDe, and user could modify code in Arduino IDe, and then upload the code into Robot. In that case, the Robot is running offline and it can not interact with Scratch’s stage.
- Scratch Mode: Under Scratch mode which is defualt mode when mBlock start, mBlock could program robot through USB serial port, the robot is running a program could communicate with mBlock, and robot could intercate with Stage and create more insteresting projects and animations.
In this project we are using stage and sprite, hence we have to work in Scratch mode to use the block which senses the keyboard input.
Step 3: Setting up the Stage and the Bat Sprite
First things first, let us select the backdrop for our stage and the bat sprite. Without them, there would be no game. Below the stage, to the left, you will see a “New backdrop” option. mBlock’s library has our required backdrops. Click on the icon which says – “Choose Backdrop from library”. A list of backdrops will appear. The backdrop we want is titled “space”. Double-click on that. You will see the change that happens.
Next, right below the stage to you can see the “New Sprite” option. Again we will choose the icon representing – “Choose sprite from library”.
Double-click on “Bat1” sprite. Now, there are two sprites – bat and panda.
As much as we love our dear friend panda, we will have to let go of him. Select the icon (small panda) for the Panda sprite (below the stage) and right click on it. One of the options in the drop down menu is “delete”. Click on it and the Panda will disappear.
Now the “Stage is set” for us to start with our game.
Now the “Stage is set” for us to start with our game.
Step 4: Creating the Bat Animation
The bat we created right now has stationary wings. Surely, an animal that flies must know how to flap its’ wings. Let us then create an animation so that the bat flaps its’ wings while flying. Switch to the “Costumes” tab. Observe that, there are two different costumes available and the orientation of the wings is different. Try to quickly switch between the two costumes by clicking the first costume and then the second one in succession. You will get a glimpse of how the bat should look while flying. We will now write a script for this animation.
To make the bat flap its’ wings while flying, we should be able to switch between costumes so quickly. Scratch has a block called “switch costume to” which can be used for switching costumes. The code is straight forward now:
The bat switches its’ costume every 0.1 seconds which gives us an impression that it is flapping it wings too while gliding.
Step 5: Bat Birth, Movement and Death Script
Once we manage to touch the bat with our Aim sprite it will disappear and a new bat will spawn and we will have to aim for that bat and so on. Here’s what we want to happen next (or what should happen with every subsequent bat):
- The new bat should spawn at a random point on the Stage.
- The bat should steadily increase in size while emerging so as to make it look more realistic.
- The bat should now fly around randomly and we will have to aim at it by adjusting the position of the Aim sprite (using a joystick).
- Once we have given the player enough time to aim, the bat should start to disappear (provided the player still isn’t able to aim) gradually i.e. decrease in size and eventually disappear.
Scratch has blocks for changing sizes and random motion etc. The script for the bat is shown below:
Read through the script and you’ll see it’s quite self-explanatory.
- The “show” block makes the bat appear but we immediately set its’ size to zero, i.e. it’ll be there but at the particular moment, you can’t see it.
- Now, we make it go to a random point in “space”. The “go to” block makes the respective sprite go to a specified X and Y coordinate. Instead of a fixed X and Y, we want it to appear at an arbitrary point (keep in mind, that you can’t see the bat as of yet since the size is zero).
- There is also a “pick random” block in Scratch which picks a random number in the given range. We use this block in the input of the “go to” block. The ranges chosen are -220 to +220 for X and -160 to +160 Y since the Stage is 480 units in length and 360 units in height with the origin at the center.
- Read what the entire “go to” block says now and you will understand that we have managed to randomize the bat’s birth location. You can find “pick random” block in operator palette.
- The bat should start to appear at the point to which it went. We do this by gradually increasing its’ size by writing the required coding under the first “repeat block”. The ‘repeat’ block repeats an action a required number of times. Every 0.05 seconds the size of the bat increases. We’ll take 50 as a standard size. To achieve this, the bat’s size is increased by 10 per iteration.
- Now we want the bat to fly around. For that, we use the glide block and make the bat fly to any random point. Very similar to what we did in the step involving “go to”. However while “go to” executes instantaneously, i.e. the bat goes to the point in the flash, like teleportation; in the glide block, you have to specify the time the bat should take to reach that point. We have set the time as 1 second, you can change it if you want. When this particular segment of the code executes, you can actually see the bat fly from one point to another on the Stage.
- We have given the player enough time to aim at the bat. If the player has still failed, the bat should disappear now. As we had increased the bat’s size to 50, we will now decrease it to zero.
- Lastly “hide” the bat.
Step 6: Creating Aim Sprite and Variables
We are now done with the bat’s activities in the game. Now let us move to another important aspect of the game, the Aim sprite.
Again, the first step will be to bring the sprite into the game. The Aim sprite is not in Scratch’s library, so we will have to import it. Download the image file for the aim sprite. When you click on the option – “Upload sprite from file” in Scratch, you will have to choose which file you want to upload, select the “aim” file and you will see that the sprite appears on the Stage. You can adjust the size (under “Looks” tab) of the sprite if it seems too large or too small to you.
To control the movement of the Aim sprite we will create two variables which keep track of its’ X-coordinate and Y-coordinate. Let’s call these variables “XPosition” and “YPosition”. Create these variables by visiting the “Data & Blocks” tab. The value stored in these variable will depend on the input we give to the joystick.
Step 7: Circuit Diagram for interfacing joystick with evive
We will be writing a code for the Aim sprite. Please make sure that the Aim sprite is selected.
A Joystick has two potentiometers (a potentiometer is a resistor which varies its’ value upon rotating a knob, recall Mr. Ohm trying to stop flowing water in Mr. Volta and Mr. Ampere’s irrigation project), which allows it to give motion directions along X and Y axes movement made by the user and a switch which gets active when user center press on the joystick. Given below is the joystick circuit.
- Black Wire: Connected to Ground (GND)
- Red Wire: Connected to 5V (VCC)
- Blue Wire: X axis potentiometer output (VRx)
- Green Wire: Y axis potentiometer output (VRy)
- Orange Wire: Switch output (SW)
Step 8: Script for Aim Control
In Scratch, we read analog reading using “read analog value“ block available in Arduino extension.
Create two variables named “XPosition“ and “YPosition“. To create them, go to “Data & Block“ palette and select create a variable.
Create two variables named “XPosition“ and “YPosition“. To create them, go to “Data & Block“ palette and select create a variable.
Write variable name and click OK. Now, you can observe new blocks in “Data & Block“ palette. Reporter blocks contain the value of the variable and other blocks are available to manipulate the variable value. Like, if you use set block, it will change the value of the variable and if you use change block it will add specified value to the variable.
Now, variables “XPosition” and “YPosition” will be changed directly according to the values read by the analog pins A0 and A1 respectively. The mean position of the potentiometer is at center hence a reading around 512 is expected at the analog pins. (the analog pins divide complete voltage range into 2^10-1 i.e. 1023 parts, starting from 0 to 1023. A value of, say 300 will mean voltage equal to 5*300/1023 Volts, mean value will be about 1023/2 i.e. ~512 ) You can refer to the script given below. Also, sign is not an issue as the resulting outputs will be either positive or negative and will hence cover whole range.
Again, all the scripts we have written till now and will write in this project will run simultaneously as long as they have the same hat block.
Step 9: Scoring Script
What’s the use of playing a game without knowing your score? It’s like having pizza without cheese, only that it wouldn’t be a pizza anymore. Let us then write a script which keeps track of score. We will write this script for the bat sprite so switch to the bat sprite by clicking on it. The logic is simple: As soon as the Aim sprite touches the bat, the player would have scored a point.
There is a “touching” block under the “Sensing” in Scratch that checks if the sprite you are writing the script for touches a particular element of the Stage. Select “aim” from the “touching” block’s drop down. Now this block will check if the bat has touched the Aim sprite or not. Create a variable “Score” to store the score.
This code will serve two purposes:
- Keep track of Score
- Recall the script for the bat we wrote. That script assumed throughout that the player wouldn’t hit the bat so it had no clause pertaining to that. That small yet instrumental detail is taken care of in here. Not only will we increase the score but we will also “hide” the bat sprite when it touches aim.
Also, in the “Data&Blocks” tab, you will see the variable list, check (tick) the small box beside “Score” and uncheck the boxes beside “XPosition” and “YPosition”. The variables you have ticked will have their values displayed on the top left corner of the Stage. We would like to display the Score but it certainly would not be convenient to display “XPosition” and “YPosition”. This is a great feature if you want to debug your code.
Step 10: Timer Script
We will give the player a limited amount of time to score as high as possible. We need a timer for that. It’ll count how many seconds are remaining on the game. Create a variable “Timer” and check the box in front of it (to display time remaining to the user). Every second the time remaining should decrease by 1.
You see that initially, the Timer has been set to 60, i.e. we are giving the player 60 seconds. We will now decrement the time remaining by 1 every second. Therefore, we will wait for one second before decreasing it by 1. Also, we want all activity to stop once the Timer reaches zero, i.e. no time is remaining and the game is over. Hence, we will repeat this loop till the Timer reaches zero (use the “repeat until” block). Once that loop exits we will stop all activity using the “stop” block.
Step 11: It's Ready! Lets Play
Your game is ready now 🙂
Try adding sounds and effects to the game every time a bat is correctly aimed at. Try Displaying “Game Over” on a black screen when the Timer reaches zero, the possibilities and modifications are infinite and restricted only by your imagination and creativity.
Circuit Diagram
| DESCRIPTION | CIRCUIT DIAGRAM |
|---|---|
The diagram shows how to interface a joystick with evive.
|  |
Code
| DESCRIPTION | DOWNLOAD CODE |
|---|---|
| Scratch Script | Download |
Không có nhận xét nào:
Đăng nhận xét