Week 7 - Classes and object-oriented programming#


  • Understand the math of acceleration and friction

  • Work with sprites

  • Add sound to your game

Week 7a - More Classes#

Acceleration and Friction#

  1. In the demo video of Joe we see that the spaceship can fly in a direction even we accelerate in another direction. The velocity vector is independent of the acceleration vector. So we may accelerate to another direction while the spaceship is moving to any direction.

  2. Joe mentions that the angle of the spaceship self.angle is updated by the spaceships angle velocity self.angle_vel. The angle is updated by self.angle += self.angle_vel. In which event handler would you update self.angle?

  3. The angle self.angle is defined in clockwise direction.

  4. The quiz question in the middle of the video is very interesting:

    Initially, at time 0, suppose your ship’s position is the point $[0,0]$, its velocity is the vector $[0,0]$, and its acceleration is the vector $[1,1]$. What would the ship’s position be after 4 time steps? Assume there is no friction.

    If you integrate the acceleration a two times over the time to get the distance, you get $d = a \times \frac{t^2}{2}$. So the distance should be $1 \times \frac{4^2}{2} = 8$. Why is the answer not $[8,8]$ but $[6,6]$?

Spaceship Class#

  1. Scott introduces the class ImageInfo which has a method called get_lifespan(). For which objects in the game is this useful?

  2. Tiled images are used for animations.


  1. Why does the sound not stop when we close the frame?

  2. The quiz question at the end of the video suggests that no sound format can be played by all the browsers. According to caniuse.com/mp3 mp3 is supported on all major browsers.

Week 7b - Sprites#

Sprite Class#

  1. From [WP: Sprite (computer graphics)]:

    … a two-dimensional bitmap that is integrated into a larger scene, most often in a 2D video game. Originally, … referred to a fixed-sized objects composited together, by hardware, with a background. …

  2. A sprite sheet is a collection of 2D images.

  3. What is the difference between a tiled image and a sprite sheet according to Joe?

  4. What is the difference between an RGB and RGBA pixel?

  5. The images we load have always a rectangular shape. What is the advantage of transparency in case of sprites with an irregular shape like a round rock?

  6. What does radius in ImageInfo describe?

    class ImageInfo:
        def __init__(self, center, size, radius = 0, lifespan = None, animated = False):
            # ...

Programming Tips - 7#

  1. If you have a problem with sounds, it could be related to your browser.

  2. Here is an excerpt from Programming Tips - 7 example code. What does inputs[i]() in do?

    def paddle1_faster():
        global paddle1_vel
        paddle1_vel += 2
    def paddle1_slower():
        global paddle1_vel
        paddle1_vel -= 2
    def paddle2_faster():
        global paddle2_vel
        paddle2_vel += 2    
    def paddle2_slower():
        global paddle2_vel
        paddle2_vel -= 2
    inputs = {"up": paddle2_slower,
              "down": paddle2_faster,
              "w": paddle1_slower,
              "s": paddle1_faster}
    def keydown(key):
        for i in inputs:
            if key == simplegui.KEY_MAP[i]:
  3. Joe mentions:

    … capture the similarities, get it right once … . And reuse whatever function or method we need to actually do the work … What is the advantage of capturing the similarities and creating a function using the similarities?

  4. Now we can also use classes to encapsulate repeated functionality and clean our code.

  5. Shorten the following code using a dict:

    if x == 'hello':
        msg = 1
    elif x == 'aman':
        msg = 3
    elif x == 'Punjabi':
        msg = 4
    elif x == 'Hollywood':
        msg = 2
  6. How would you rewrite the following code to make it more explicit and easier to maintain?

    SIZE = (75, 10)
    CENTER = (37.5, 5)
  7. You want to place an object roughly in the right upper quadrant of your frame. How would you rewrite the following code with a better code style?

WIDTH = 640
HEIGHT = 480
object.draw([483, 358])
  1. For better code style, you should name the constants that you use in your program. If some constant is dependent on another constant, you should define your constant as such, e.g., CONST1 = CONST2 + ....

  2. If you have a long, unwieldy statement, try to break it into multiple pieces and name them.