Computer Science Grade 9 20 min

4. Drawing Shapes and Colors

Learn how to draw basic shapes (rectangles, circles, lines) and use colors in Pygame.

Tutorial Preview

1

Introduction & Learning Objectives

Learning Objectives Initialize a Pygame window and set its dimensions. Define and use colors using the RGB tuple format. Draw fundamental shapes like rectangles, circles, and lines onto the Pygame surface. Correctly use functions from the `pygame.draw` module. Explain and apply Pygame's coordinate system, where (0, 0) is the top-left corner. Fill the background with a solid color and update the display to show their drawings. Ever wondered how games like Pong or Snake are built from simple shapes? 🎮 Let's learn how to draw the basic building blocks of any 2D game! This lesson introduces the fundamentals of drawing in Pygame. You will learn how to create a game window, define colors, and draw basic geometric shapes, which are the visual foundation for characters,...
2

Key Concepts & Vocabulary

TermDefinitionExample SurfaceIn Pygame, a Surface is a blank canvas that you can draw on. The main window you see is the primary Surface, but you can create other Surfaces for images or text.`screen = pygame.display.set_mode((800, 600))` creates a main display Surface that is 800 pixels wide and 600 pixels high. RGB Color ModelA method for creating colors by mixing Red, Green, and Blue light. In Pygame, colors are represented as a tuple of three numbers from 0 to 255.`(255, 0, 0)` is pure red, `(0, 255, 0)` is pure green, `(0, 0, 0)` is black, and `(255, 255, 255)` is white. Coordinate SystemA 2D grid used to position items on the screen. In Pygame, the origin point (0, 0) is at the top-left corner. The x-value increases to the right, and the y-value increases downwards.A coordinate of `(...
3

Core Syntax & Patterns

Defining a Color COLOR_NAME = (R, G, B) Always define colors as a tuple of three integers, each between 0 and 255, representing Red, Green, and Blue. Assign them to variables with descriptive names for readability. Drawing a Rectangle pygame.draw.rect(surface, color, (x, y, width, height)) This is the standard function for drawing a filled rectangle. You must specify which surface to draw on, the color to use, and a tuple defining the rectangle's position (x, y) and size (width, height). Drawing a Circle pygame.draw.circle(surface, color, (center_x, center_y), radius) This function draws a filled circle. You must provide the surface, the color, a tuple for the center's coordinates, and the radius (distance from the center to the edge). The Basic Draw Lo...

4 more steps in this tutorial

Sign up free to access the complete tutorial with worked examples and practice.

Sign Up Free to Continue

Sample Practice Questions

Challenging
If a blue circle is drawn first, and then a smaller yellow circle is drawn at the same center point, what will be the visual outcome?
A.Only the blue circle will be visible.
B.The circles will be next to each other.
C.yellow circle with a blue ring around it.
D.Only the yellow circle will be visible.
Challenging
To perfectly center a rectangle with width `rect_w` and height `rect_h` on a screen with width `screen_w` and height `screen_h`, what is the correct formula for its top-left (x, y) coordinates?
A.x = (screen_w - rect_w) / 2, y = (screen_h - rect_h) / 2
B.x = screen_w / 2, y = screen_h / 2
C.x = (screen_w / 2) + (rect_w / 2), y = (screen_h / 2) + (rect_h / 2)
D.x = rect_w / 2, y = rect_h / 2
Challenging
A student's code is meant to draw a green circle on a white background. The window opens but stays black. Which of these single errors is the most likely cause? CODE: `screen.fill(255, 255, 255)`, `pygame.draw.circle(screen, (0, 255, 0), (100, 100), 50)`
A.The circle is being drawn off-screen.
B.The circle's color is defined incorrectly.
C.The `screen.fill` color is formatted incorrectly, causing a crash before the display can be updated.
D.The radius of the circle is too small to be seen.

Want to practice and check your answers?

Sign up to access all questions with instant feedback, explanations, and progress tracking.

Start Practicing Free

More from VI. Game Development Basics with Pygame

Ready to find your learning gaps?

Take a free diagnostic test and get a personalized learning plan in minutes.