Sunday 21 April 2019

Pygame: Resizing a window

Pygame: Resizing a window

We already know how to create a game window using pygame. For creating a window, we use pygame.display. We set window size by setting the display mode in pygame. Now what if we want to make the window full screen? or we want to hide it, or resize it,
There are some meethods in pygame.display module

While setting the display mode, if we provide a third parameter, pygame.FULLSCREEN, we get a full screen window. For UNIX X11 driver there is one more function pygame.display.toggle_fullscreen() which works as switch between fullscreen mode and normal mode.


if you want to hide the window leaving only icon behind to get the access next time to the running window, use pygame.display.iconify() method.

A working example of all these functions, is in the following gist.



You might get confused that above script just gives an empty window that can be resizable but it works just the same as window with contents check out following gist

Sunday 31 March 2019

Pygame : Working with Sprites and animations




We already know how to load and display images in pygame now. But those are only images. You can do nothing more than displaying those images using a surface object. For making games we need more than simply displaying. And here comes the Sprite module.

By using this module to its full potential, you can easily manage and draw your game objects. The sprite classes are very optimized, so it's likely your game will run faster with the sprite module than without.
This module not only allow you to draw the images, but also do many operations on them like animations, grouping etc.. Also it provides collision detection power to your game development process. You need not write the whole collision detection code by yourself.

The sprite module provides two classes:
  1. Sprite
  2. Group
The Sprite class is designed to be a base class for all your game objects while the Group class is container for the sprites. For example if you are creating a menu for your game, all the buttons in the menu are sprites. And the menu itself is a sprite group.

In this post let’s see an example of sprite class:
Let’s animate the ship in our previous example with some water ripples around it. Like in following video



In the above video what we see our ship is not moving right now but having the water around it is moving. To create this animation we’ll use the sprite module of pygame. Till now our ship was only an image but now we’ll turn it into a game object. To do so we’ll have to create a class Ship extending class pygame.sprite.Sprite as follows:

class Ship(pygame.sprite.Sprite):
def __init__(self):
super(Ship, self).__init__()


In sprite class we need to assign the image of sprite as “self.image = image_to_assign”
now, we have to display a ship, and a set of water ripple frames around it. That means our main image is ship and we have to blit the water ripples along with the ship.
So we’ll assign self.image=ship and create an array for animation frames as “self.animFrames” and store the ripple images in this array. In this way we have what we need to create our animation.

Now we have to display this animation. Here, if we display all the ripple frames at a time, we can’t call it animation; we want to animate it show frame by frame. That means we’ll need a timer and an index to store current frame. And also a position to display our sprite and its animation. So let’s modify our sprite class:

class Ship(pygame.sprite.Sprite):
    index = 0

    def __init__(self, texture, animFrames, x=0, y=0, width=1, height=1):
        super(Ship, self).__init__()
        self.image = texture
        self.animFrames = animFrames
        self.currentFrame = self.animFrames[0]
        self.x = x
        self.y = y
        self.rect = self.image.get_rect()
        self.width = self.rect.width
        self.height = self.rect.height

Here we are providing texture of ship and animation frames as well as the rect details to sprite from parameters.

To keep the animation updating let’s write the update method:

def update(self):
    if self.isAnimating:
        self.animate()

and to implement the animation functionality, let’s add the following methods:

def startAnimation(self):
    self.isAnimating = True

def animate(self):
    self.index += 1
    if self.index >= len(self.animFrames):
        self.index = 0
    self.currentFrame = self.animFrames[self.index]
    time.sleep(0.01)

def stopAnimation(self):
    self.isAnimating = False


Here the time.sleep provides us the delay of displaying the next animation frame. Now we have done everything our update method is properly updating the sprite according to animation but to display the animation on the screen, we’ll have to use the draw method of sprite class:

def draw(self, surface):
    surface.blit(self.currentFrame, (self.x-self.width, self.y-self.height*0.2))
    surface.blit(self.image, ((self.x), (self.y)))


Here we are drawing the animation frame first and on top of the animation frame we are drawing the ship. Because we want the water ripple under the ship.

Now we have successfully created the Ship class we only have to instantiate it on our previous window and run the code

so as usual first load images:

We already have loaded the ship. We only need to load animation frames

shipAnimFrames_str = ["ripple0.png", "ripple1.png", "ripple2.png", "ripple3.png", "ripple4.png"]

shipAnimFrames = []
i = 0
while i < len(shipAnimFrames_str):
    shipAnimFrames.append((pygame.image.load(shipAnimFrames_str[i])))
    i += 1

ShipSprite = Ship(ship, shipAnimFrames, winWidth*0.45, winHeight*0.75)
ShipSprite.startAnimation()

and inside the game loop
call the update() and draw() of ShipSprite
as
ShipSprite.update()
ShipSprite.draw()


save the code and run it to get output like above.


The complete code for the above is as follows:



Similarly you can use the background image also as sprite rather than a surface. By making it sprite you can convert this whole code into an endless travel for your ship as shown in following video.


You can get the complete source code for this endless travel in the following repo. In the coming post let’s see what more we can do with sprites like collision detection, grouping, other animations etc.. so stay tuned.

Tuesday 5 March 2019

Pygame Images; a little More.....

A Little More About Pygame Images!


In previous post, we loaded and displayed images. Since we now know, how to load images, let's check out some more things that we can do with images...

In first post, we set a text caption of the window now let's set an icon of the window.

copy and paste these lines before the Game_Window= pygame.display.set_mode(winWidth,winHeight)

ship= pygame.image.load("ship.png")
pygame.display.set_icon(ship)

 
Here point to remember is you need to set the icon before creating the Game_Window. A 32X32 icon is generally recommended.

Our background is a river with banks, lets add some bushes on both the sides of bank. We first need to load the image of bush.

bush=pygame.transform.scale((pygame.image.load("bush.png")),(50,50))

the bush image i'm having with me is little bigger so im going to scale it down to 50X50
now let's create an array of bushes to show many bushes on the bank of river. Here we do not need to create so many images by loading images again and again. We have a method called as copy() that will create copy of surface bush. so let's create 10 bushes here add the following lines below bush definition.
bushes=[]
i=0
while i < 10:
     bushes.append(bush.copy())
     i+=1

now we have created 10 bushes we have to display those on the river bank.
Let's reassign i to 0 and
just below blitting the background, add the following lines
while i < len(bushes)
    if i%2==0:
        Game_Window.blit(bushes[i],(winWidth*0.03,50*i))
     else:
        Game_Window.blit(bushes[i],(winWidth*0.83,50*i))
     i+=1
   
So now our window is going to look like


Now Let's add a ship in our river. As we already have loaded the image, we don't need to load it again.
To display the ship on the window, we'll have to blit it on the window. Add the following line before pygame.display.update().
Game_Window.blit(ship,(winWidth*0.45,winHeight*0.75))
This will show the ship on the bottom of our window. We can also see the icon in the dock in the following image that is going to show the output of whatever we have done above.

Now Let's see how to move this ship forward till the other end of river...
we only have to update the position of the ship. so before our game loop starts, define starting "y" Position of ship as
y=winHeight*0.75
 
update the y value as soon as you enter the game loop as follows:
if y>0:
     y-=1

 And after you have blit background on the game window, now blit the ship as
Game_Window.blit(ship,(winWidth*0.45,y))


At the end of game loop instead of
pygame.display.update(),call pygame.display.flip() to update the entire screen so you'll get the ship moving upwards.

You can also play with transparency of images. All you need to do is set the alpha of the surface. The alpha values range from 0 to 255. 0 is a total transparent while 255 is completely opaque.

Following is the complete code we worked till now. In this code we have a background, aset of some bushes, a moving ship an icon to window and a semitransparent image drawn on the background.

The images required are in the same gist's attachments

Now We can display images why not to use all those to create a simple game using these assets. In next post let's create some animations and have a look on events in pygame.

Wednesday 27 February 2019

Images in Pygame

How to display Images in Pygame?


In previous post, we created an empty window for our game. In this post, let's add some images to our window.
In Pygame, Images are represented by a pygame object called as "surface". The Surface has a fixed resolution and pixel format
In previous post, when we wrote a code that gave us an empty window which was looking like this.


Now we want to show some real picture on this window let's say something looking like this


for this we need to use two pygame modules those are pygame.surface and  pygame.image

there is a method called pygame.image.load() which is used to load images  and a blit() function of surface object to show one image on top of another.

please checkout following source code link that will give you a step by step guide to get your window displayed as



and yeah,we got how to display images on our empty game window that we created in previous post .
Get the source code Here! 

Saturday 23 February 2019

PyGame- Create a blank window for your game

How To Create an empty window for your game in Pygame


In last post we saw what is Pygame and how to install it. In this post let's start the first step for your game i.e. the display of your game. We are going to need a window in which you are going to place your other game objects. So let's get started....

To create our game window we are going to use pygame module named "display". This module creates a fully controlled display for our game.

Let's create a file named as GameScene.py and add the following code in it.

import pygame 
from pygame.locals import *

This'll import pygame in your file. Now for our window, we are going to need the dimensions  i.e. width and height. so let's define them also a color. These lines will define these things

winWidth=600
winHeight=480
color_CYAN=(0,255,255)

now we need to initialize the pygame and the display. The following lines will do it.

pygame.init()
Game_Window=pygame.display.set_mode((winWidth,winHeight))

Here we have created an object named as Game_Window, which is going to give us a rectangular surface with a  width of 600 pixels and a height of 480 pixels.

Let's save the file and run the code as follows:

$python GameScene.py

you'll see a blank window like this






Right now you'll see this window just once and it'll get disappeared. To keep it displayed continuously, we'll need to update the display continuously. Add the following lines in your GameScene.py


while True:

    pygame.display.update()


These lines will keep the window steady on your screen but you'll see the "X" button to close window will not work right now. To make it work we'll have to detect event of closing the window.
In your above while loop, add the following lines those are going to detect the events triggered on the display.

for event in pygame.event.get():
        if event.type==QUIT:
            pygame.quit()
            exit()



Here we are getting all the events triggered  on our window and detecting the type of event. If we get a QUIT type of event, we are firing command pygame.quit() that is going to quit the window.

Now we have an empty window for our game. We can also change it's Title currently we see the title is "pygame window". Let's change it to "Empty Game Window"

add the following two lines after pygame.init()

caption="Empty Game Window"
pygame.display.set_caption(caption)



and you see title  of the window changed



Now let's change the background color of the window.
Add the following line after the Game_Window definition.

Game_Window.fill(color_CYAN)

And when we save and run this code, we'll see the output as:




And that's it!! Now you are ready to write your game with a resolution of 600X480 window.

The final code for the above window should look like:



In next post let's display some images on this empty window. 

            

Wednesday 20 February 2019

Want to make games without installing heavy game engines? Try Pygame



What is Pygame?


    Pygame is one of the most popular 2d game engines. It is SDL wrapper for python. It is a powerful and very simple to use game engine. it is specifically designed for game development so you get all the basic elements of a game in it (eg.. sprites, timer, display functionality, sound functionality, events etc..)
Pygame is highly portable means you can use it with nearly with every platform.

If you want to teach kids programming, they find programming more interesting when they make something like games. With pygame you can write your full game code in a single file. You need not to create a big and complicated file structure if you don't want to.


What you need to get started with Pygame?

    The thing that you need to get started with pygame is python3 installed on your system. Python 3.6.1 or greater is recommended by Pygame.


How to install?

The best way to install pygame is with the pip tool (which is what python uses to install packages).
when you install python(newer versions), you get pip automatically installed. We use the --user flag to tell it to install into the home directory, rather than globally.

You need latest pip to install pygame. Try upgrading pip if pygame starts compiling from source and and fails to install.  

Run the following commands  to install pygame on your system:

Windows:-

    py -m pip install -U pygame --user

Linux:-

    python3 -m pip install -U pygame --user

You get Pygame already installed with Raspberry Pi. You need not install it.

If you want to install on Mac or other platform, go through the installation process Here


Once you have installed Pygame, you are ready to GO......

Stay tuned for posts related to how to use the various elements of Pygame

In the Next post we'll see how to create an empty game window using Pygame...