Lab 11: Event-based programming

CS151: Computational Thinking: Visual Media

Spring 2019

Goals

In this lab, you will explore principles from event-based programming and create a simple video game that roughly approximates the 70s arcade game Asteroids. Specifically, we will use timer events, keyboard button events, and collision detection.

As the gateway into the final project, this lab will review concepts we've learned all semester: lists, objects and object-oriented design, classes, inheritance, top-down design, and more.

Setup

1. Make a new folder called Project 11. Copy over turtle_interpreter.py, lsystem.py, and shapes.py from Project 10.
2. Copy over a recent scene file that you made from Project 9 or 10 (e.g. home.py or mosaic.py). This will be the background artwork for your video game!
3. Copy over any L-system txt files that your scene or shapes depend on.

TurtleInterpreter

1. We are going object-oriented with turtle in this project! Replace your call to turtle.setup() in the TurtleInterpreter constructor with self.screen = turtle.Screen(). This creates an object of type Screen, which represents the turtle canvas. Call the setup() method on the Screen object, passing in your desired canvas size (e.g. dx, dy).
   
   Make sure you do this step AFTER checking whether the TurtleInterpreter has been initialized!
2. Create a get method getScreen for the screen instance variable.

Shape

1. Move the creation of your TurtleInterpreter object from draw to the constructor. Make it an instance variable of Shape. Update your function calls in draw to refer to your TurtleInterpreter instance variable.
2. Create a get method getScreen that calls the getScreen method from your TurtleInterpreter instance variable. This method will pass the Screen object from the TurtleInterpreter to your game.

Game: Background artwork

1. Open the file with the scene that you copied from a prior project (e.g. home.py).
2. Make sure that the scene that you want to be the background artwork for your game is fully encapsulated in a function (if it's not, fix it). There should not be any top-level code in this file.
3. Remove all direct references to TurtleInterpreter/terp in your file (this includes removing calls to hold()!). You should only work with Shape objects in your function.
4. After creating your first Shape object, call its getScreen method and assign the screen object that it returns to a variable. For example:

sky = shapes.Square(distance=1000, fill=True)
screen = sky.getScreen()

• Note if using mosaic: You most likely have a mosaic function that calls a tile function in a nested loop.

  • Create a 'dummy' shape at the beginning of mosaic (before the loops): e.g. sqr = shapes.Square() (filling in any required parameters). We're calling it 'dummy' because we aren't actually going to draw it, we just want to use it to get the Screen object.
  • Call getScreen on your 'dummy' shape object (e.g. sqr), assign the screen object that it returns to a variable.
  • Return the screen object at the end of the mosaic function.

• Note about the purpose of screen: We want to pass the Screen object from where it was created in the first shape in your scene to the game. Here is a summary of its path:
  
  self.screen (TurtleInterpreter constructor) -> getScreen (TurtleInterpreter) -> getScreen (Shape) -> scene (home.py/mosaic.py/etc) -> setupBackground (Game) -> self.screen (Game constructor)

5. At the end of the scene function, return the screen object.
6. Create a new file game.py.
7. Within the new file, create a:

• Game class. Import turtle.
  • setupBackground method. It should call your scene function to draw your background artwork (e.g. in home.py). Have setupBackground return the screen object returned by artwork scene function.
  • constructor. It should call your setupBackground method and assign the return value to an instance variable in Game (e.g. self.screen). This should be the first thing that you do in the constructor.
• main function outside of the class. Create a new Game object, then call its run method (see next step) to start the game.
• if __name__ == '__main__' top-level code at the bottom of the file that calls the main function.

8. Add the following run method to your Game class:

def run(self):
    '''
    Turns the tracer animations on (but speeds up animations) and starts the main game loop.
    '''
    # Make sure animations are on but fast
    turtle.tracer(True)
    turtle.speed(0)

    # Let's go!
    self.screen.mainloop()

9. Run game.py. If everything is working so far, you should simply see your background artwork scene drawn to the screen (no game elements yet).

Game: Player Turtle

1. Create the makePlayer method in Game. It should

• Create a turtle object (turt = turtle.Turtle())
• Make the turtle shape look like a spaceship. Download the rocketship image, save it into your project folder. Run the following commands:

turtle.register_shape('rocketship.gif')  # Make the rocketship image available to turtle
turt.shape('rocketship.gif')  # Set the turtle icon to the rocketship image

• NOTE: In your project, you may use your own images. Python 3.7 wants you to convert the image files to *.GIF format. You can do this in Paint3D on Windows, in the Paint-like program of your OS’s choice, or with ImageMagik in the Terminal (see instructions in Project 4).
• In your file header, be absolutely sure to credit the original author! Failing to credit the author of a code sample like this is an academic integrity violation. Brian Marks. Available at: https://blog.trinket.io/using-images-in-turtle-programs/
• Pick the pen up.
• Make the turtle object face north.
• Return the turtle object.

2. Call the makePlayer method from your constructor (after you setup the background artwork), assigning the output to an instance variable (e.g. self.player).
3. Run your game. You should now see your rocketship in the scene.

Game: Interactive player control

We're going to make the player turtle (rocketship) move under keyboard control!

1. Add instance variables for player speed (units: pixels) and turn rate (units: degrees) in the Game constructor. You might wish to create optional parameters for these, giving them default values of 20 and 10, respectively.
2. Create the following methods in Game:

• up: Move the player forward by its speed
• down: Move the player backward by its speed
• left: Turn the player left by its rotation rate
• right: Turn the player right by its rotation rate

3. Create the setupEvents method that creates your game events. Add keyboard callback events to the four movement methods you just created. Here, callback means that we will instruct our game to move our player by calling one of movement methods when we press the appropriate keyboard button. To add a callback, we call the onkey method of the Screen object. It has the following syntax: self.screen.onkey(<Method name>, <String of keyboard button>). For example self.screen.onkey(self.up, "Up") for moving the player up. To assign to the four arrow keys, use the strings: "Up", "Down", "Left", "Right".
4. Add a callback to call the quit function when the user presses the "q" key.
5. Call the listen method on your screen object so that it will start calling the movement methods when you press the arrow keys.
6. Call setupEvents at the end of the constructor.
7. Run your game. You should now be able to move your player around the scene!

Game: Enemies!

In this task, we will create a number of enemy turtle objects that move randomly.

1. In your constructor, create four hard-coded (x, y) bounds instance variables, defining the rectangular region in which the game enemies will occupy. For example, this could roughly correspond to the top third of your screen.
2. Create a method with the signature def placeEnemyRandomly(self, turt):, which will move the turt object to random coordinates within the enemy bounds you defined in (1).
3. Create a method with the signature def makeEnemies(self, n): It should

• Create a list of n turtle objects.
• Change their avatars to squares (turt.shape('square')) and set the color to a color of your choosing via the usual means.
• Pick up their pens and call self.placeEnemyRandomly on each enemy.
• Return the enemy list.

4. Call makeEnemies from your Game constructor, assign the return value to an instance variable (e.g. self.enemies). Either hard code n (number of enemies) or make it an (optional) parameter in your constructor.
5. Run your game. You should see stationary enemy square objects in their designated zone.

Game: Enemies on the move

In this task, we will create a timer event to randomly move the enemies over time.

1. Create the method def moveEnemiesRandomly(self):. It should set each enemy's position to the current position plus a small random (x, y) offset.
2. In setupEvents, create a timer that will automatically call moveEnemiesRandomly 50 msec after the game starts. The syntax is: self.screen.ontimer(<method name to call>, <int: wait time in msec>).
3. The ontimer only will call the moveEnemiesRandomly method ONCE 50 msec in the future, but we want to continue moving them every 50 msec indefinitely. To do this, add an identical timer at the end of moveEnemiesRandomly. Make sure that you understand why we're doing this before continuing.
4. Run your game. You should see your enemies moving on the screen!

Game: Collision detection

We will create another timer event to have the enemy take an action when the player collides with it.

1. Add an instance variable to the constructor that defines how close the player needs to get to an enemy for the game to register that a collision happened (collision radius). You may wish to make an (optional) parameter of the constructor. A reasonable default value is 30 pixels.
2. Create the method: def checkForCollisions(self):. It should

• Calculate the distance between the player and each enemy.
• If the distance is less than the collision radius, print "BOOM!" and call placeEnemyRandomly on the enemy that the player collided with.

3. Add a timer callback in setupEvents to check for collisions.
4. Add an identical timer callback at the end of checkForCollisions.
5. Run your game. Test it by colliding with an enemy. Something should happen!

When your interactive elements are working, you’re ready for Project 11: Video Game Design!

© Caitrin Eaton & Oliver W. Layton