Skip to content

Latest commit

 

History

History
179 lines (148 loc) · 4.76 KB

File metadata and controls

179 lines (148 loc) · 4.76 KB

Week 13 – Moving Dot (Pygame Zero Setup)

Objectives

  • Install and configure Pygame Zero
  • Understand the Pygame Zero structure (WIDTH, HEIGHT, draw(), update())
  • Create first animated object with automatic game loop
  • Understand the difference between Turtle and Pygame Zero

Concept explanation (kid-friendly)

  • Pygame Zero is a game-making library that handles the "boring" parts automatically
  • No need for mainloop() - it runs automatically at 60 FPS (frames per second)
  • We define what to UPDATE (change) and what to DRAW (show)
  • Perfect for making real video games!

Connection to Turtle (weeks 7-12)

Turtle Pygame Zero
screen.mainloop() Automatic game loop
ontimer() for animation update() called 60x/second
turtle.goto() Change x, y variables
Limited shapes Any graphics possible

Lesson flow (60–75 min)

1) Warm-up + Installation (15–20 min)

  • CRITICAL: Ensure Pygame Zero is installed before lesson
  • Test installation (see docs/pygame_zero_setup.md)
  • Run the test program together
  • Troubleshoot any issues

If installation fails: Have browser-based backup (Replit) ready!

2) New concept (10–15 min)

Pygame Zero structure:

# 1. Configuration (outside functions)
WIDTH = 600
HEIGHT = 400

# 2. Variables (game state)
x = 100
vx = 3  # velocity (speed and direction)

# 3. update() - change game state
def update():
    global x, vx
    x = x + vx
    if x > WIDTH or x < 0:
        vx = -vx  # Bounce!

# 4. draw() - show everything
def draw():
    screen.clear()  # Erase previous frame
    screen.fill('blue')  # Background color
    screen.draw.filled_circle((x, 200), 10, 'white')

Key points:

  • WIDTH and HEIGHT are special - Pygame Zero uses them
  • update() runs 60 times per second automatically
  • draw() runs after each update
  • screen is automatically available (no import!)
  • Must use global to modify variables in functions

###3) Guided build (20–25 min)

Part A: Basic setup (5 min)

WIDTH = 600
HEIGHT = 400
  • These create the window size
  • Must be at the TOP of file, outside functions
  • Try changing to 800x600

Part B: Variables and velocity (7 min)

x = WIDTH // 2  # Start at center
y = HEIGHT // 2
vx = 3          # Move 3 pixels right each frame
  • // is integer division (no decimals)
  • Velocity = how much to change position each frame
  • Positive vx = move right, negative = move left

Part C: Update function (8 min)

def update():
    global x, vx  # Need global to modify
    x += vx       # Same as: x = x + vx
    
    # Bounce off edges
    if x < 10 or x > WIDTH - 10:
        vx = -vx  # Reverse direction
  • Runs automatically 60 times per second
  • Changes what's happening in the game
  • Bouncing: reverse velocity when hit edge

Part D: Draw function (10 min)

def draw():
    screen.clear()  # Must clear each frame!
    screen.draw.text("Moving Dot", (20, 20))
    screen.draw.filled_circle((x, y), 10, "white")
  • Shows everything on screen
  • clear() prevents "trails" (try removing it!)
  • Draw order matters (last drawn appears on top)

4) Independent challenge (15–20 min)

Task A: Run and observe

  • Watch the dot bounce
  • Count how many times it bounces in 10 seconds

Task B: Modifications

  • Change dot color to "red"
  • Change velocity to 5 (faster)
  • Change dot size to 20
  • Add vertical movement (vy variable)

Task C: Enhancements

  • Make dot change color when it bounces
  • Add second dot moving opposite direction
  • Make dot leave a trail (don't clear screen)

5) Wrap-up (5 min)

  • "What do WIDTH and HEIGHT do?"
  • "What's the difference between update() and draw()?"
  • "How is this different from Turtle's mainloop()?"
  • "Why do we need global keyword?"

Common errors to demo

  1. Variables inside functions

    def update():
        x = x + vx  # Error! No global

    Fix: Add global x, vx

  2. Forgetting screen.clear()

    def draw():
        screen.draw.circle((x, y), 10, 'white')  # No clear!

    Shows: Trails everywhere (actually cool effect!)

  3. Wrong variable names

    width = 600  # Wrong! Should be WIDTH (capitals)
  4. Not updating position

    def update():
        global vx
        # Forgot to actually change x!

Success criteria

  • Student can run Pygame Zero program
  • Student understands update() vs draw()
  • Student can modify velocity and size
  • Student can explain automatic game loop

Materials needed

  • Pygame Zero installed (critical!)
  • docs/pygame_zero_setup.md
  • week13.py file
  • Backup: Replit account ready

Homework/practice

  • Add vertical bouncing (y and vy)
  • Create two dots bouncing
  • Make dot speed up over time
  • Research: What is FPS (frames per second)?