Join us and get access to thousands of tutorials and a community of expert Pythonistas.

Unlock This Lesson

This lesson is for members only. Join us and get access to thousands of tutorials and a community of expert Pythonistas.

Unlock This Lesson

Hint: You can adjust the default video playback speed in your account settings.
Hint: You can set your subtitle preferences in your account settings.
Sorry! Looks like there’s an issue with video playback 🙁 This might be due to a temporary outage or because of a configuration issue with your browser. Please refer to our video player troubleshooting guide for assistance.

Drawing on the Screen

Christopher Bailey
Make a 2D Side-Scroller Game With PyGame Christopher Bailey 02:50
Recommended Tutorial Course Slides (.pdf) Sample Code (.zip) Ask a Question

In this lesson, you’ll start drawing on the screen using a Surface. Recall that a Surface is a rectangular object on which you can draw, like a blank sheet of paper. The screen object is a Surface, and you can create your own Surface objects separate from the display screen.

You’ll fill the screen with white, and add a new Surface object to display on the screen. Add the code below your existing code, starting at line 44. Note the indentation, keeping the lines you are adding within the game loop, but outside the event loop:

Python 
44# Fill the screen with white
45screen.fill((255, 255, 255))
46
47# Create a surface and pass in a tuple containing its length and width
48surf = pygame.Surface((50, 50))
49
50# Give the surface a color to separate it from the background
51surf.fill((0, 0, 0))
52rect = surf.get_rect()

For more information about the Surface and Rect classes, check out the following resources from the pygame documentation:

00:00 In this lesson, you’re going to start drawing on the screen. There’s two commands you’ve used so far to accomplish drawing on the screen, and they were screen.fill(), which filled in the background, and then you used pygame.draw.circle() to draw a circle.

00:18 Well, there’s a third way, and that third way is to use a Surface, which you might remember is a rectangular object on which you can draw. It’s kind of like a blank sheet of paper.

00:28 And I might note that the screen object that you create is a Surface also. And throughout the rest of this tutorial, we’re going to create several more surfaces for your game.

00:37 Let me take you into the code. So, your next step is to fill in the screen with white. And the screen—here on line 25, you created the screen with the pygame.display.set_mode(), and then you used those two variables. So, down here, on line 44, within the game loop but you’re going to back out of the event loop—so you’re still in the main loop, just not in the event queue—you’re going to fill in the screen with white. To do that, screen is that object that you’ve created—it’ll have a method called .fill().

01:12 It’s going to take a tuple of the color. You’ve already done this before, but (255, 255, 255) is white, all white. Great. On line 47, you’re going to create a Surface and pass in a tuple that contains the length and width. Again, it’s a rectangle.

01:31 This Surface is just going to be called surf.

01:36 And here’s that tuple. I’ll have you make it 50 pixels by 50 pixels—a square.

01:41 On line 50, you’re going to give the Surface a color so that it’s separated from the background.

01:49 To do that, you use the object surf and then use .fill() again—again, it takes a tuple. Let’s use black, which will be (0, 0, 0) in RGB. And then you’re going to use this other method of the Surface, which is to get a rectangle of it, and you’re going to simply call it rect.

02:05 So rect will be a new object, and from surf you will get the rectangular coordinates—if you will—of it. Get the rectangle out of it. Okay. Go ahead and save.

02:18 Now, if you were to run this one more time, you’re not going to see much change, and that’s because these elements haven’t been updated to display on the screen.

02:31 That’s really what the next lesson’s all about. So, go ahead and press Escape or close the window.

02:38 As you’ll notice, just creating a Surface doesn’t mean it’s going to display on the screen. So in the next lesson, you’ll learn about using .blit() and .flip().

Become a Member to join the conversation.