Lab 3.5: Control Quincy: the Quorum Bunny
Controlling items on the screenGoals
In this lab, we will learn the following computer science concepts:
- Creating Objects
- Using conditional statements
Computer Science Principles Curriculum
- Big Idea: Algorithms: EU 4.1, LO 4.1.1, EK 4.1.1A, EK 4.1.1C, EK 4.1.1D
Common Core Standards
- English Language Arts Standards » Science & Technical Subjects: CCSS.ELA-Literacy.RST.9-10.2, CCSS.ELA-Literacy.RST.9-10.3, CCSS.ELA-Literacy.RST.9-10.4, CCSS.ELA-Literacy.RST.9-10.5, CCSS.ELA-Literacy.RST.9-10.6, CCSS.ELA-Literacy.RST.11-12.2, CCSS.ELA-Literacy.RST.11-12.3, CCSS.ELA-Literacy.RST.9-10.1, CCSS.ELA-Literacy.RST.9-10.2, CCSS.ELA-Literacy.RST.9-10.7, CCSS.ELA-Literacy.RST.9-10.8, CCSS.ELA-Literacy.RST.9-10.9
- Standards For Mathmatical Practice: CCSS.Math.Practice.MP1, CCSS.Math.Practice.MP2, CCSS.Math.Practice.MP5, CCSS.Math.Practice.MP6, CCSS.Math.Practice.MP7, CCSS.Math.Practice.MP8,
Vocabulary
- Control Structures
- If Statement
- Looping
- Input Manager
Overview
This lab demonstrates how to use key presses on the keyboard to perform some tasks. The task you will perform is to write a program that moves an image of a bunny around the screen upon pressing of the up, down, left, and right arrow keys. Download this zip file for a template to help you get started, or use the IDE below.
Understanding the InputMonitor and KeyboardEvent Libraries
Open the provided template and navigate to the Main.quorum file . Near the top of the file, there are two lines that look like this:
// this line declares an InputMonitor object called "inputMonitor"
InputMonitor inputMonitor
// this line declares a KeyboardEvent object called "keys"
KeyboardEvent keys
These two lines declare the objects you use to determine if a specific key has been pressed on the keyboard. The InputMonitor
object knows when a key is pressed down, and the KeyboardEvent
object knows which key is pressed down.
You use these objects to determine when a key is pressed down and which key is pressed down.
The InputMonitor
object has an action called IsKeyPressed
that takes a KeyboardEvent
object variable and returns a boolean
— true
if the passed key is pressed, false
if not. You need to pass the KeyboardEvent
object variable to the IsKeyPressed
action, telling the KeyboardEvent
object which key you want to check is pressed. This is done with the following code:
Example: Use the InputMonitor
and KeyboardEvent
object to execute code when a key is pressed.
// This line of code will execute the statement(s) inside the if statement when
// the A key is pressed down.
if inputMonitor:IsKeyPressed(keys:A)
output "The 'A' Key was pressed!"
end
This line looks a little complicated, so let’s break it down. inputMonitor
is the name of our InputMonitor
object. We are calling its IsKeyPressed
action. Its parameter is a variable that lives in our KeyboardEvent
object. The variable is the all-caps representation for the key.
For example, "A" represents the A key, "NUM_7" represents the 7 key, and "F2" represents the F2 key.
This action returns a boolean
which we can use with an if
statement to execute code only when that action returns true
—i.e., when the key in question is pressed down.
Goal 1: Creating Objects
Navigate to the action called CreateGame
on line 36 through line 37. This is where you load the images for your Drawable
objects. An Drawable
object has already been declared for you, called bunny
. Load the image called "media/bunny.png" to theDrawable
object.
Activity: Load an image to your Drawable
object and add it to the screen.
Recall that to load an image to a Drawable
object, we call the Load
action, passing the file name of the file we want to load. Once you have your Drawable
loaded, you should add it to the game. This is done by calling the Add
action with your Drawable
as the parameter. Now that you have your Drawable
loaded and added to the game, you can begin writing the code to move the image around the screen upon key presses.
Navigate to the action called Update(number seconds)
on line 46 through line 47. This action is called on every frame of your game.
This is where you write your code to handle the key presses.
This action should check whether some keys are pressed down and, if they are, begin the appropriate task for those keys.
Goal 2: Using Conditional Statements
The bunny should move vertically upon pressing of the up or down arrow keys.
You need to check whether the up and down arrow keys are pressed.
The names of the variables in KeyboardEvent
objects that represent the up and down arrow keys are UP
and DOWN
, respectively.
If the up arrow key is pressed, the bunny should move up the screen.
To do this, you need to get the current y-coordinate of the Drawable
object by calling the GetY
action. The new y-coordinate should be set to the current y-coordinate plus the speed of the Drawable
(declared and set earlier in the program) multiplied by the time between frames (the parameter of the Update(number seconds)
action in which you are currently writing your code).
Example: Write the code that moves the bunny up when the Up key is pressed.
// this if statement checks when the Up key is pressed
if inputMonitor:IsKeyPressed(keys:UP)
// this line of code gets the current y position of the bunny
number y = bunny:GetY()
// this line calculates the new y position based on the current y
number newY = y + speed * seconds
// this line sets the new y position
bunny:SetY(newY)
end
If the down arrow key is pressed, the bunny should move down the screen.
To do this, you need to get the current y-coordinate of the Drawable
object by calling the GetY
action.
The new y-coordinate should be set to the current y-coordinate minus the speed multiplied by the seconds.
Activity: Write the code to move the bunny down the screen if the DOWN
key is pressed.
The bunny should move horizontally upon pressing the right or left arrow keys.
You need to check whether the left or right arrow keys are pressed.
The names of the variables in KeyboardEvent
objects that represent the left and right arrow keys are LEFT
and RIGHT
, respectively.
If the left arrow key is pressed, the bunny should move left across the screen.
To do this, you need to get the current x-coordinate of the Drawable
object by calling the GetX
action.
The new x-coordinate should be set to the current x-coordinate minus the speed of the Drawable
(declared and set earlier in the program) multiplied by the seconds between frames (the parameter of the Update(number seconds)
action in which you are currently writing your code).
Example: Write the code to move the bunny towards the left when the Left key is pressed.
// this if statement checks when the Left key is pressed
if inputMonitor:IsKeyPressed(keys:LEFT)
// this line gets the current x position
number x = bunny:GetX()
// this line calculates the new x position based on the current x
number newX = x – speed * seconds
// this line sets the new x position
bunny:SetX(newX)
end
If the right arrow key is pressed, the bunny should move right across the screen.
To do this, you need to get the current x-coordinate of the Drawable
object by calling the GetX
action.
The new x-coordinate should be set to the current x-coordinate plus the speed multiplied by the seconds.
Activity: Write the code to move the bunny towards the right when the RIGHT
key is pressed.
You may now compile and run your code. There should be no errors. If there are errors, fix them and try again. You should be able to move the bunny horizontally and vertically around the screen by pressing the appropriate keys.
Bonus Activity! Try experimenting with different keys and moving the bunny in different directions. You might try using the W
, D
, A
, and S
buttons. If you ever intend to make an MMORPG you'll need to start here!
Next Tutorial
In the next tutorial, we will discuss Lab 3.6, which describes how work Robot in Quorum..