Category: Pygame

If you are following this tutorial from the beginning you know that I have created a Vector2D module to help the game character to accomplish various tasks such as moves to a certain coordinate point on the game screen and so on but do you know that actually you do not need to create the Vector2D module if you do not want to because there is already a ready made Vector2 module in Pygame which will do most of the jobs above for us. This Vector2 module is under the pygame.math package so if we want to extend the features of this module then all we need to do is just to create a subclass based upon that Vector2 module. I will make the previous Vector2D module as the subclass of this Vector2 module when I create my next game with Pygame if I ever need to!

With the introduction of the Vector2 module above we have finally finished our pygame tutorial series for beginner and as I have promised to my reader before I will start to create a real game with Pygame where you will be able to read every step I have made in order to create this new game. So make sure that you subscribe and continue reading my blog if you want to learn how to develop your own game with Pygame. See you in the next tutorial!

When it comes to sprites overlap detection rectangle detection method is not as accurate as circle detection method and circle detection method is less accurate than the bitmasks detection method. According to the Pygame wiki page this is what the bitmasks method does and what it needs to detect the overlapping between two sprites.

Tests for collision between two sprites, by testing if their bitmasks overlap. If the sprites have a “mask” attribute, that is used as the mask, otherwise a mask is created from the sprite image. Intended to be passed as a collided callback function to the *collide functions. Sprites must have a “rect” and an optional “mask” attribute.

You should consider creating a mask for your sprite at load time if you are going to check collisions many times. This will increase the performance, otherwise this can be an expensive function because it will create the masks each time you check for collisions.

If you want to create the mask attribute then all you need is this line of command

sprite.mask = pygame.mask.from_surface(sprite.image)

where sprite.image is the surface of the game sprite. Then you will use this command to check the overlapping between two sprites

pygame.sprite.collide_mask(left_sprite, right_sprite)

where the left_sprite and the right_sprite is the sprite object you wish to check for overlapping, the method above will return the first point on the mask where the overlapping occurs or None if there was no overlapping.

One thing you need to take note of is if you are using the spritesheet to animate the sprite object instead of a single image then you should use the circle detection method instead because you will need to create different sprite surface object as well as different mask attribute which is really against the game’s performance if you go with the bitmask method above. Otherwise use the bitmasks method will result in the most precise overlapping detection as compared to the rectangle and the circle detection method!

In the previous tutorial we are using the rectangle area of the sprite to detect the overlapping between two sprite objects but today we will use the circle area to detect the above mentioned event instead which is more accurate as compared to the rectangle detection method because we can simple adjust the radius of the circle accordingly to achieve the best affect!

In order to use the circle detection method we will need to include a new radius attribute in the GameSprite module which will now replace the rect attribute uses to detect the sprite overlapping event (you can still use the rect attribute if you want to but the outcome will be the same as the rectangle detection method).

Below is the only line of code we have to add in under def __init__(self, image, width, height) of GameSprite module.

#use to detect overlap
self.radius = width/4

By providing the radius attribute and then set it to 1/4 of the sprite width we now don’t even need to recalculate the Rect object after each position update of the sprite and therefore we can comment out the below lines of code under detectCollide(self, right, player_draw_pos, enemy_draw_pos)

#self.rect = Rect(player_draw_pos.x, player_draw_pos.y, self.width, self.height)
#right.rect = Rect(enemy_draw_pos.x, enemy_draw_pos.y, right.width, right.height)

Under the same method above we will now change the overlapping detection method from pygame.sprite.collide_rect(self, right) to pygame.sprite.collide_circle(self, right) and that is all we need.

Now if you run the main game module you will notice that the overlapping only occurs when the enemy get closed enough to the player as compared to the previous method where the enemy will be removed even it looks like the enemy is still some distance apart from the player.

Pygame offers the pygame.transform module which we can use to rotate, flip as well as scale the gaming character as we wish to and today I am going to show you how to scale down the gaming character with the pygame.transform.scale method. The pygame.transform.scale method is really simple to use, all we need is a surface, and a tuple contains both the scale width and scale height, there is another third parameter in the method which is the optional destination surface but we usually do not need it in most of the scenario so we can leave it alone at the moment. Here is how to scale a game character to a new dimension.

self.image = pygame.transform.scale(self.image, (32, 32)) #this method takes in a surface plus a tuple contains both the scale width and the scale height and it returns a new surface which will be assigned to the self.image

The method above should be included under the setImage method of the GameSprite module which we have created in the previous tutorial and we will only apply it if the enemy and the player has overlapped each other. Below video will show you how the player will be scaled to smaller size after it has overlapped with the enemy.

Pygame has a a few great interfaces that we can use to detect whether game character has overlapped each other or not and today we are going to look at one of them which is the pygame.sprite.collide_rect method. This method will take in two sprite objects that will then be used to find out the condition of the overlap. If no overlap happens then the above method will return False or else it will return True.

The script below is not perfect because it will only detect the overlapping once in the entire game and moves the enemy sprite in the opposite direction after the first overlapping occurs. This program is uses just to demonstrate to you how the above mentioned method works.

First thing we need to do before going into the main module is to modify the previous GameSprite module by making it a subclass of the pygame.sprite.Sprite class and then change it’s getImage method so we do not need to create a new GameSprite object on every loop pass just like before. Finally we will include a new detectCollide method which will return a boolean value indicates whether two sprite have overlapped each other or not.

import pygame
from pygame.locals import *

class GameSprite(pygame.sprite.Sprite):

    # Constructor. Pass in the image file
    # and it's width and height
    def __init__(self, image, width, height):
        # Call the parent class (Sprite) constructor
        pygame.sprite.Sprite.__init__(self)

        # Create the spritesheet surface from the image file
        self.sprite = pygame.image.load(image).convert_alpha()
        
        #register the width and height of the sprite
        self.width = width
        self.height = height
        
    def getImage(self, x_sprite, y_sprite, flip): # this method will return a subsurface which represents a portion of the spritesheet
    
        #the rectangle object uses in clipping
        self.clip_rect = Rect((x_sprite, y_sprite), (self.width, self.height))
        
        self.sprite.set_clip(self.clip_rect) # clip a portion of the spritesheet with the rectangle object
        sub_surface = self.sprite.subsurface(self.sprite.get_clip()) #create sub surface
        return pygame.transform.flip(sub_surface, flip, False) #return a new flip surface
    
    def detectCollide(self, right, player_draw_pos, enemy_draw_pos): #return a boolean value indicates whether the player has collided with enemy or not
        # create the rectangle object for both enemy and player that will be used in the collide_rect function
        self.rect = Rect(player_draw_pos.x, player_draw_pos.y, self.width, self.height)
        right.rect = Rect(enemy_draw_pos.x, enemy_draw_pos.y, right.width, right.height)
        return pygame.sprite.collide_rect(self, right)

The next thing we need to do is to include the detectCollide method in our main game loop to detect the overlapping of two objects.

#!/usr/bin/env python

import pygame
from pygame.locals import *
from sys import exit
from vector2d import Vector2D
from game_sprite import GameSprite

robot_sprite_sheet = 'left.png'

pygame.init()

screen = pygame.display.set_mode((640, 480), 0, 32) #return a screen surface with desire screen size
pygame.display.set_caption("Pygame Demo")

w, h = 64, 64 # width and height of the sprite
sprite_counter = 0 # initialize the sprite_counter
game_frame = 0 # initialize the game_frame counter

#direction control for player
flip = False

#direction control for enemy
face_left = True

clock = pygame.time.Clock() # initialize the clock object
player_pos = Vector2D(30, 240) # initial position of the player sprite
enemy_pos = Vector2D(450, 240) # initial position of the enemy sprite
game_speed = 70. # speed per second

#create the player sprite 
game_sprite = GameSprite(robot_sprite_sheet, w, h)

#the enemy sprite object
game_sprite_two = GameSprite(robot_sprite_sheet, w, h)

while True:
   
    for event in pygame.event.get():
        
        if event.type == QUIT:
            exit()
            
    v = Vector2D(0., 0.) # reset the speed to zero on each pass
    
    pressed_keys = pygame.key.get_pressed() # get all the keys from key-press events 
        
    if pressed_keys[K_LEFT]: 
        flip = True # if the user pressed the left arrow key then makes the sprite object facing left
        v = Vector2D(-1., 0.) # move the object one unit to the left
        
    elif pressed_keys[K_RIGHT]:
        flip = False # if the user pressed the right arrow key then makes the sprite object facing right
        v = Vector2D(1., 0.) # move the object one unit to the right
            
    screen.fill((205, 200, 215))
    
    #blit the player with new position
    player_draw_pos = Vector2D(player_pos.x-w/2, player_pos.y-h/2)
    game_sprite_surface = game_sprite.getImage(sprite_counter * 64, 0, flip) # get the new sprite surface
    screen.blit(game_sprite_surface, player_draw_pos)
    
    #blit the enemy with new position
    enemy_draw_pos = Vector2D(enemy_pos.x-w/2, enemy_pos.y-h/2)
    game_sprite_surface_two = game_sprite_two.getImage(sprite_counter * 64, 0, face_left) # get the new sprite surface
    screen.blit(game_sprite_surface_two, enemy_draw_pos)
    
    #increase the sprite counter after x numbers of frame
    if(game_frame % 50 == 0):
        
        sprite_counter += 1
        
        if(sprite_counter > 5):
            sprite_counter = 0
            
    game_frame += 1
    
    time_passed = clock.tick() #delta time for each frame
    time_passed_seconds = time_passed / 1000.0
       
    #set the player's new position after each frame
    player_pos+= v * game_speed * time_passed_seconds   
    
    #if player collides with enemy, enemy flips and changes it's direction
    if(game_sprite.detectCollide(game_sprite_two, player_draw_pos, enemy_draw_pos)):
        face_left = False
    
    if(face_left == True):
        enemy_pos += Vector2D(-1., 0.) * game_speed * time_passed_seconds 
    else:
        enemy_pos += Vector2D(1., 0.) * game_speed * time_passed_seconds
    
    pygame.display.flip()

By running the above module you will see that after a contact has occurred the enemy sprite will move in the opposite direction.

pygame.sprite.collide_rect method

In order to create a stand still sprite animation with Pygame we need to

1. Create a GameSprite object which will take in the spritesheet and processes it then return a surface of the sprite which can then be used in the screen.blit method.
2. Create a rectangle object which will be used to clip the area of the spritesheet.
3. Create a mechanism which will change the sprite image as well as only change to the new sprite image after x numbers of frame so the sprite will not change that fast on the screen!

Before we start make sure you have created your own spritesheet with each sprite consists of 64px width and 64px height. Below is the spritesheet I have used in this tutorial, I am only using six out of the seven sprite from below spritesheet because the last sprite which is the jumping sprite is not required in this tutorial.

Below is the GameSprite module which will be used in our next pygame module.

import pygame

class GameSprite(object):
    
    def __init__(self, image, rect):
        self.image = image
        self.rect = rect
        self.sprite = pygame.image.load(image).convert_alpha()
        
    def getImage(self): # this method will return a subsurface which is a portion of the spritesheet
        self.sprite.set_clip(self.rect) # clip a portion of the sprite with the rectangle object
        return self.sprite.subsurface(self.sprite.get_clip())

We can use the above module in this next module to create a stand still animation sprite.

#!/usr/bin/env python

import pygame
from pygame.locals import *
from sys import exit
from vector2d import Vector2D
from game_sorite import GameSprite

robot_sprite_sheet = 'left.png'

pygame.init()

screen = pygame.display.set_mode((640, 480), 0, 32)
pygame.display.set_caption("Pygame Demo")

w, h = 64, 64 # width and height of the sprite
sprite_counter = 0 # initialize the sprite_counter
game_frame = 0 # initialize the game_frame counter

player_pos = Vector2D(320, 240) # initialize the position of the sprite

while True:
   
    for event in pygame.event.get():
        
        if event.type == QUIT:
            exit()
            
    
    screen.fill((205, 200, 115))
    
    rect = Rect((sprite_counter * 64, 0), (64, 64)) # the rectangle object uses to clip the sprite area 
    game_sprite = GameSprite(robot_sprite_sheet, rect)
    game_sprite_surface = game_sprite.getImage() # get the sprite surface
    
    player_draw_pos = Vector2D(player_pos.x-w/2, player_pos.y-h/2)
    screen.blit(game_sprite_surface, player_draw_pos)
    
    #increase the sprite counter after x numbers of frame
    if(game_frame % 30 == 0):
        sprite_counter += 1
        if(sprite_counter > 5):
            sprite_counter = 0
            
    game_frame += 1
    
    pygame.display.flip()

If you run the above script then you will get the below outcome…

Reference:

1. http://stackoverflow.com/questions/10560446/how-do-you-select-a-sprite-image-from-a-sprite-sheet-in-python

2. The Vector2D module has already been mentioned in the previous post