Pygame Lesson 1-3: More About Sprites

Tags: python tutorial gamedev pygame

This is part 3 of our tutorial series, “Game Development with Pygame”. It is intended for beginner/intermediate programmers who are interested in game development and improving their Python coding skills. You should start with Part 1: Getting Started

You can watch a video version of this lesson here:

Moving to graphical sprites

Colored rectangles are fine - they’re a great way to start and make sure you have the basics of your game working, but sooner or later you’re going to want to use a cool spaceship image or character for your sprite. This leads us to the first issue: where do you get your game graphics.

Where to find art

When you need art for your game, you have 3 choices:

  1. Draw it yourself
  2. Find an artist to draw it for you
  3. Use pre-existing art from the Internet

1 and 2 are fine if you or your friends are artistically inclined, but for most programmers (yours truly included), creating nice-looking art is not in our skill set. So that leaves the Internet, and it’s very important to remember that you shouldn’t use art that you do not have the right to use. While it’s easy enough to search and find a picture of Mario or your favorite Pokemon, that doesn’t mean that it’s OK for you to use it in your game, especially if you plan to put it online and let other people see it.

Fortunately, there’s a good solution: OpenGameArt.org. This website is loaded with tons of art, sound, music, and more - and it’s all generously licensed by the artists for you to use in your games. One of the best artists you can find there is named Kenney (just put his name in the search box).

You can also visit Kenney’s website.

The reason I love to use Kenney’s art (besides the fact that it’s very high quality) is that he likes to release it in packs. This means that you can get sets of art that will all match in style, instead of trying to mix and match images from multiple artists.

For this lesson, we’re going to use Kenney’s Platformer Art Complete Pack, which has lots of graphics for making a platformer-style game. Go ahead and download it and unzip. We’re going to use the image “p1_jump.png”:

You can also just click on the image above to download the player image.

Organizing your game assets

First we need a folder to hold our assets, which is a term game developers use to refer to things like art and sound. I called the folder “img” for short, and I put the player image into it.

To use this image in our game, we need to tell Pygame to load the picture file, which means we need our program to know where the file is located. Depending on what kind of computer you are using, this can be different, and we want to be able to run our program on any computer, so we need to load a Python library called os, and then specify where our game is located:

 import pygame
 import random
 import os

 # set up asset folders
 game_folder = os.path.dirname(__file__)
 

The special Python variable __file__ refers to whatever folder your game code is saved in, and the command os.path.dirname figures out the path to that folder. For example, on my computer, the path to my code is this:

/Users/chris/Documents/gamedev/tutorials/1-3 sprite example.py

But I’m using a computer running OS X. If you’re using Windows, your path might look like this:

C:\Users\chris\Documents\python\game.py

As you can see, different operating systems use different ways of describing where things are located on the computer. By using the os.path command, we can let the computer figure out what the right path is (whether to use “/” or “\” for example.)

Now, we can specify our “img” folder:

 import pygame
 import random
 import os

 # set up asset folders
 game_folder = os.path.dirname(__file__)
 img_folder = os.path.join(game_folder, 'img')
 player_img = pygame.image.load(os.path.join(img_folder, 'p1_jump.png')).convert()
 

Now we’ve loaded our image by using pygame.image.load() and we’ve made sure to use convert(), which will speed up Pygame’s drawing by converting the image into a format that will be faster to draw on the screen. Now we’re ready to replace the plain green square in our sprite with our fancy player image:

class Player(pygame.sprite.Sprite):
    def __init__(self):
        pygame.sprite.Sprite.__init__(self)
        self.image = player_img
        self.rect = self.image.get_rect()
        self.rect.center = (WIDTH / 2, HEIGHT / 2)
 

Notice we’ve deleted the self.image.fill(GREEN) commmand - we don’t need it to be filled with a solid color anymore. get_rect() will still work just fine, because it looks at whatever self.image is to figure out what the bounding rectangle should be.

Now if you run the program, you should see a nice little cartoon alien running across the screen. But we have a problem - one we can’t see because the background is currently black. Change the screen.fill() command at the bottom to something else - I decided to use BLUE. Now you can see the issue:

When you have an image file on the computer, that file is always a rectangular grid of pixels. No matter what shape you’ve drawn, there’s still a border of pixels filling the “background” of your image. What we need to do is tell Pygame to ignore the pixels in the image that we don’t care about. In this image, those pixels happen to be black, so we can add the following:

class Player(pygame.sprite.Sprite):
    def __init__(self):
        pygame.sprite.Sprite.__init__(self)
        self.image = player_img
	self.image.set_colorkey(BLACK)
        self.rect = self.image.get_rect()
        self.rect.center = (WIDTH / 2, HEIGHT / 2)
 

set_colorkey() just tells Pygame that when we draw the image we want to ignore any pixels of the specified color. Now our image looks much better:

Congratulations, you have now learned the basics of working with Pygame! Now it’s time to start making a real game. We have created a few tutorials showing the process of creating a full game from start to finish. They get more complex as we go, so it’s recommended that you follow them in order.

Click here for the full list of tutorials.

Comments