Experimenting with Pygame #2: Superman Returns :)

Hi Guys. Welcome to the pygame experimentation. Continuing from the previous post, we saw how to print a Hello world like text in the pygame window. That’s nice but not cool. Because when doing game development, we like to see something game like. Yeah now we are talking Game. Let’s now see some game like animation and how to make it.

So everybody loves Superman including me. Normal superman flies on his own, but our pygame superman needs our help. So lets make him fly through the clouds.

From this pygame experiment we will see,

  • How to load a picture into pygame.
  • How to transform the picture according to the need.
  • How to right a simple code to animate the picture.

So here we are going to animate superman to fly straight up amidst the clouds. So we need to get two set of pictures, superman and clouds. So first the code. Then we will break it up.

__author__ = 'Krishnan'

import sys
import pygame

# Initializing pygame
pygame.init()
# Setting the window size
window_size = length, width = (800, 600)
# Setting the frames per second to 20 fps
fps = 20
# Initializing the pygame clock object
clock = pygame.time.Clock()
# Setting x and y coordinates
x, y = (300, 300)
# Creating the screen object
screen = pygame.display.set_mode(window_size)

# Loading the images into the pygame window
superman = pygame.image.load("superman.png")
clouds = pygame.image.load("clouds.png")

# Transforming the image according to the window scaling
superman = pygame.transform.scale(superman, (200, 200))
clouds = pygame.transform.scale(clouds, (800, 600))

# Loading the images on the screen
screen.blit(clouds, (0, 0))
screen.blit(superman, (x, y))

# The Game Loop
while True:
    # Setting the clock tick to the fps defined above
    clock.tick(fps)
    # Looping through the events
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            sys.exit()

    # Filling the background or redrawing background
    # each and every time to avoid unclean rendering
    screen.blit(clouds, (0, 0))
    # Logic of the program
    if y == 0:
        y = 300
    else:
        y -= 10
    screen.blit(superman, (x, y))
    pygame.display.flip()

I will exclude the basics of pygame. If you want to know you can go to my first post on pygame. Let’s directly jump into the necessities for this part.

First of all you need to load the pictures into pygame. We use the load() method in pygame.image to do the same.

superman = pygame.image.load("superman.png")
clouds = pygame.image.load("clouds.png")

The pictures you get need not always be suiting to your window requirement. Hence we need to resize or transform the pictures to suit to our pygame resolution. This can be done by the scale method in pygame.transform.

superman = pygame.transform.scale(superman, (200, 200))
clouds = pygame.transform.scale(clouds, (800, 600))

Now we have loaded the image and transformed it to our need. Now lets draw them onto the screen. We use the same blit() method for drawing the images too.

screen.blit(clouds, (0, 0))
screen.blit(superman, (x, y))

Now put in your Game loop and the for loop to get the list of events. Dont forget the exit event. Now to the program logic. So we are going to make superman fly continously from bottom to up. Hence we have initially drawn superman at the bottom of the screen. So our logic is to bring superman up till the ‘y’ coordinate reaches zero. When it reaches zero we reset to original position at the bottom. By doing this we animate our superman to fly.

superman_flying

Now thats not all. There are couple of things we must keep in mind.

  • We must never forget to redraw the background. Here it is the clouds. Or else the animated images gets drawn in unclean background and animation will look some thing like this.

unclean_bg

  •  For animations use the pygame.time.Clock(). Because the default animation time will differ from machine to machine. If our machine is slow we can see the animation for a glimpse. In faster machine the animation happens in a flash. So to make it uniform we must use the clock object and give the frames per second.

Thats all for this part folks. Stay tuned for more on pygame. 🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s