Intro to Game Programming

Introduction To
Game Programming
EuroPython 2010
Richard Jones

The Basics
• Displaying something

The Basics
• Controlling animation

The Basics
• User input

The Basics
• User input
• Gameplay mechanics

The Basics
• User input
• Playing sound effects and music

The Basics
• User input
• Playing sound effects and music
• Game architecture

Displaying Something

• Opening a window


• Reading images


• Reading images
• Displaying images


• Reading images
• Displaying images
• Organising the display of images (scene
composition)

Opening a Window
import cocos
from cocos.director import director

director.init()

scene = cocos.scene.Scene()

director.run(scene)

Drawing
import cocos

director.init()

sprite = cocos.sprite.Sprite('kitten.jpg')
scene.add(sprite)

director.run(scene)

Anchoring

(256, 256)
512 px

512 px

Anchoring
import cocos

director.init()

sprite = cocos.sprite.Sprite('kitten.jpg', anchor=(0,0))
scene.add(sprite)

director.run(scene)

Using a Layer
import cocos

director.init()

layer = cocos.layer.Layer()
scene.add(layer)
layer.add(sprite)

director.run(scene)

Animation
import cocos
from cocos import actions
...
layer = cocos.layer.Layer()
scene.add(layer)
layer.add(sprite)

sprite.do(actions.MoveBy((100, 0)))

director.run(scene)

Getting Organised
import cocos

class AsteroidsGame(cocos.scene.Scene):
def __init__(self):
super(AsteroidsGame, self).__init__()

self.player = cocos.layer.Layer()
self.add(self.player)
self.ship = cocos.sprite.Sprite('data/ship.png', (width/2, height/2))
velocity = (100, 0)
self.ship.do(actions.MoveBy(velocity))
self.player.add(self.ship)

director.init()
width, height = director.get_window_size()
director.run(AsteroidsGame())

Adding Asteroids
import random

import cocos

def create_asteroid(layer, size, position, speed):
'''Create an asteroid of a certain size and speed.
'''
s = cocos.sprite.Sprite('data/%s_asteroid.png' % size, position)
s.size = size
layer.add(s)
velocity = (random.randint(-speed, speed), random.randint(-speed, speed))
dr = random.randint(-speed, speed)
s.do(actions.Repeat(actions.MoveBy(velocity, 1) | actions.RotateBy(dr, 1)))

...

Adding Asteroids
...
super(AsteroidsGame, self).__init__()

# place the asteroids in a layer by themselves
self.asteroids = cocos.layer.Layer()
self.add(self.asteroids)
for i in range(3):
# place asteroids at random positions around the screen
position = (random.randint(0, width), random.randint(0, height))
create_asteroid(self.asteroids, 'big', position, 100)

# place the player ship in another layer
...

Better action
...
s.size = size
layer.add(s)
s.velocity = (random.randint(-speed, speed), random.randint(-speed, speed))
s.dr = random.randint(-speed, speed)
s.do(actions.Move())
...

Screen Wrapping
...
s.velocity = (random.randint(-speed, speed),
random.randint(-speed, speed))
s.do(actions.WrappedMove(width, height))
...
self.ship.velocity = (100, 0)
# move the ship kinematically and wrapped to the screen size
self.ship.do(actions.WrappedMove(width, height))
...

Gameplay Mechanics
• Player Controls

Gameplay Mechanics
• Player Controls
• Timed rules (when objects appear; moving
the play ﬁeld)

Gameplay Mechanics
• Player Controls
the play ﬁeld)
• Interaction of game objects

Gameplay Mechanics
• Player Controls
the play ﬁeld)
• Interaction of game objects
• Detecting important events (game won or
game over)

User Input

• Getting events

User Input

• Getting events
• Distinct keyboard events vs. keyboard state

Control
import math
import random

from pyglet.window import key
import cocos

Control

y = speed x sin(rotation)
ng)
ho oti
rs
n, o
er atio
l
a cce
d (or
s pee
rotation
x = speed x cos(rotation)

Control
x = speed x cos(rotation)

y = speed x sin(-rotation)
rotation
spe
ed
(or
acc
ele
rat
ion
, or
sho
oti
ng)

Control
class MoveShip(actions.WrappedMove):
def step(self, dt):
super(MoveShip, self).step(dt)

# set the rotation using the left and right arrow keys
self.target.dr = (keys[key.RIGHT] - keys[key.LEFT]) * 360

# figure the x and y heading components from the rotation
rotation = math.radians(self.target.rotation)
rotation_x = math.cos(rotation)
rotation_y = math.sin(-rotation)
# accelerate along the heading
acc = keys[key.UP] * 200
self.target.acceleration = (acc * rotation_x, acc * rotation_y)

Control

...
self.ship = cocos.sprite.Sprite('data/ship.png', (width/2, height/2))
self.ship.velocity = (0, 0)
# animate the ship with our custom action
self. ship.do(MoveShip(width, height))
self.player.add(self. ship)
...

Control

...
# open the window, get dimensions, watch the keyboard and run our scene
director.init()
keys = key.KeyStateHandler()
director.window.push_handlers(keys)
director.run(AsteriodsGame())

Detecting Collisions

• Pixel-Perfect


• Pixel-Perfect
• Axis-Aligned Bounding Box


• Pixel-Perfect
• Circle-Circle


• Pixel-Perfect
• Circle-Circle
• Hash Map

Pixel-Perfect

Axis-Aligned Bounding Box

Circle-Circle

Hash Map

d = {(42,42): [ship], (43, 42): [ship], (44, 42): ship, ...
(52, 45): [asteroid], (53, 45): [asteroid], ...}

Collision Detection

distance

...
Collision

def collide(a, b):
'''Determine whether two objects with a center point and width
(diameter) are colliding.'''
distance = math.sqrt((a.x-b.x)**2 + (a.y-b.y)**2)
return distance < (a.width/2 + b.width/2)

class MoveAsteroid(actions.WrappedMove):
def step(self, dt):
super(MoveAsteroid, self).step(dt)

# detect collision between this asteroid and the ship
if collide(self.target, director.scene.ship):
quit('GAME OVER')

...

Collision

'''Create an asteroid of a certain size and speed.
'''
s.size = size
layer.add(s)
s.velocity = (random.randint(-speed, speed), random.randint(-speed, speed))
s.do(MoveAsteroid(width, height))

...

Shooting
...

if self.target.gun_cooldown:
# still limiting the gun rate of fire
self.target.gun_cooldown = max(0, self.target.gun_cooldown - dt)
elif keys[key.SPACE]:
# fire a bullet from the ship
b = cocos.sprite.Sprite('data/bullet.png', (self.target.x,
self.target.y))
# send it in the same heading as the ship
b.velocity = (rotation_x * 400, rotation_y * 400)
# the bullet has a lifespan of 1 second
b.life = 1
director.scene.player.add(b)
# move the bullet with its custom action
b.do(MoveBullet(width, height))
# ship may only shoot twice per second
self.target.gun_cooldown = .5

...

Shooting
class MoveBullet(actions.WrappedMove):
def step(self, dt):
super(MoveBullet, self).step(dt)

# age the bullet
self.target.life -= dt
if self.target.life < 0:
# remove from play if it's too old
self.target.kill()
return

# see if the bullet hits any asteroids
for asteroid in director.scene.asteroids.get_children():
if collide(self.target, asteroid):
# remove the bullet and asteroid
self.target.kill()
asteroid.kill()
return

... and winning

...
super(MoveShip, self).step(dt)

# if there's no asteroids left then the player has won
if not director.scene.asteroids.children:
quit('YOU WIN')

...

Creating chunks
def create_asteroid(layer, size, position, velocity, rotation, speed):
'''Create an asteroid of a certain size, possibly inheriting its
parent's velocity and rotation.
'''
s.size = size
dx, dy = velocity
s.velocity = (dx + random.randint(-speed, speed),
dy + random.randint(-speed, speed))
s.dr = rotation + random.randint(-speed, speed)
layer.add(s)
s.do(MoveAsteroid(width, height))

Creating chunks

for asteroid in director.scene.asteroids.get_children():
if collide(self.target, asteroid):
# remove the bullet and asteroid, create new smaller
# asteroid
self.target.kill()
create_smaller_asteroids(asteroid)
asteroid.kill()
return

Creating chunks
...
position = (random.randint(0, width), random.randint(0, height))
create_asteroid(self.asteroids, 'big', position, (0, 0), 0, 100)

def create_smaller_asteroids(asteroid):
asteroids = director.scene.asteroids
if asteroid.size == 'big':
# if it's a big asteroid then make two medium asteroids in
# its place
for i in range(2):
create_asteroid(asteroids, 'medium', asteroid.position,
asteroid.velocity, asteroid.dr, 50)
elif asteroid.size == 'medium':
# if it's a medium asteroid then make two small asteroids in
# its place
for i in range(2):
create_asteroid(asteroids, 'small', asteroid.position,
asteroid.velocity, asteroid.dr, 50)

Sound

• Reading sound ﬁles

Sound

• Reading sound ﬁles
• Playing sounds and background music

Sound Effects
import math
import random

import pyglet
from pyglet.window import key
import cocos

# load our sound effects
explosion_sound = pyglet.media.load('data/explosion.wav', streaming=False)
bullet_sound = pyglet.media.load('data/bullet.wav', streaming=False)

...

Sound Effects

...
# ship may only shoot twice per second
self.target.gun_cooldown = .5
bullet_sound.play()

...

Sound Effects

...
asteroid.kill()
explosion_sound.play()
return

Game Architecture

• Player lives

Game Architecture

• Player lives
• Game won / game over screen

Game Architecture

• Player lives
• Opening screen

Game Architecture

• Player lives
• Opening screen
• Options menu

Invulnerability
class Ship(cocos.sprite.Sprite):
gun_cooldown = 0
velocity = (0, 0)
is_invulnerable = False

def set_invulnerable(self):
self.do(actions.Blink(10, 1) +
actions.CallFunc(self.set_vulnerable))
self.is_invulnerable = True

def set_vulnerable(self):
self.is_invulnerable = False

Invulnerability

self.player = cocos.layer.Layer()
self.add(self.player)
self.ship = Ship('data/ship.png', (width/2, height/2))

# animate the ship with our custom action
self.ship.do(MoveShip(width, height))
self.ship.set_invulnerable()

Invulnerability

super(MoveAsteroid, self).step(dt)

if director.scene.ship.is_invulnerable:
return

quit('GAME OVER')

Lives

self.ship.set_invulnerable()

# another layer for the "HUD" or front informational display
self.hud = cocos.layer.Layer()
self.add(self.hud)
self.lives = cocos.text.Label('Lives: 3', font_size=20, y=height, anchor_y='top')
self.lives.counter = 3
self.hud.add(self.lives)

Lives

lives = director.scene.lives
lives.counter -= 1
director.scene.ship.set_invulnerable()
if not lives.counter:
quit('GAME OVER')
else:
lives.element.text = 'Lives: %d' % lives.counter

Scenes
class MessageScene(cocos.scene.Scene):
def __init__(self, text):
super(MessageScene, self).__init__()
class UserActivity(cocos.layer.Layer):
is_event_handler = True
def on_mouse_press(*args): director.pop()
def on_text(*args): director.pop()
layer = UserActivity()
self.add(layer)
t = cocos.text.Label(text, font_size=40,
x=width/2, anchor_x='center',
y=height/2, anchor_y='center')
layer.add(t)

Scenes
# if there's no asteroids left then the player has won
if not director.scene.asteroids.children:
director.replace(MessageScene('You Win'))

...
lives.counter -= 1
director.scene.ship.set_invulnerable()
if not lives.counter:
director.replace(MessageScene('Game Over'))
else:
lives.element.text = 'Lives: %d' % lives.counter

Menu
class MenuScene(cocos.scene.Scene):
def __init__(self):
super(MenuScene, self).__init__()

# opening menu
menu = cocos.menu.Menu("Asteroids!!!!")
menu.create_menu([
cocos.menu.MenuItem('Play', lambda: director.push(AsteroidsGame())),
cocos.menu.MenuItem('Quit', pyglet.app.exit),
])
menu.on_quit = pyglet.app.exit
self.add(menu)

# open the window, get dimensions, watch the keyboard and run our scene
director.init()
keys = key.KeyStateHandler()
director.window.push_handlers(keys)
director.run(MenuScene())

Special Effects

• Simple image animations

Special Effects

• Simple image animations
• Use libraries like lepton

Controlling Animation

• Image position on screen


• Updates over time


• Accounting for frame rate


• Accounting for frame rate
• Frame to use from multiple images

Animation from
multiple images

Special Effects

...
explosion_sound = pyglet.media.load('data/explosion.wav', streaming=False)
bullet_sound = pyglet.media.load('data/bullet.wav', streaming=False)

# load our explosion animation
explosion = pyglet.image.load('data/explosion.png')
explosion_grid = pyglet.image.ImageGrid(explosion, 2, 8)
explosion = explosion_grid.get_animation(.05, False)

...

Special Effects

# remove the bullet and asteroid, create new smaller
# asteroid
self.target.kill()
s = cocos.sprite.Sprite(explosion, self.target.position)
s.velocity = asteroid.velocity
s.do(actions.WrappedMove(width, height) |
(actions.Delay(.05 * 16) +
actions.CallFuncS(lambda s: s.kill())))
self.target.parent.add(s)
asteroid.kill()

Other Game Types

• minesweeper
• car driving
• platformer
• tower defence

Minesweeper

• rendering a grid of cells
• detecting mouse clicks on cells
• exposing contents

Car Driving

• different movement model
• detecting correct circuit
• detecting collision with edge of track
(pixel-based collision detection)

Platformer

• rendering game layers
• handling triggers
• platformer physics

Tower Defence

• tower placement (selection & position)
• movement solution for creeps

Other Things

• kytten
GUI controls for pyglet / cocos2d
• cocograph
map editing

Where To From Here?

• http://los-cocos.org
• http://pyglet.org
• http://pygame.org
• http://inventwithpython.com/
• http://pyweek.org

Intro to Game Programming

More Related Content

What's hot

Similar to Intro to Game Programming

More from Richard Jones

Recently uploaded

Intro to Game Programming

Editor's Notes