Suscríbete vía RSS Síguenos en Twitter

Pygame III: Cargar imágenes

adrigm | 14/02/2010 | 11 Comentarios

En el primer tutorial aprendimos a importar e inicializar, En la segunda parte a crear una ventana y en este aprenderemos a cargar imagenes y a mostrarlas en pantalla.

Cargando imagenes

Para cargar una imagen en Pygame vamos a usar una función que está muy bien y facilita mucho el cargar imágenes al vuelo, pongo la función y la explicamos línea por línea:

def load_image(filename, transparent=False):
        try: image = pygame.image.load(filename)
        except pygame.error, message:
                raise SystemExit, message
        image = image.convert()
        if transparent:
                color = image.get_at((0,0))
                image.set_colorkey(color, RLEACCEL)
        return image

La línea 1 define la función, recibe dos parámetros el nombre/ruta del archivo y la segunda si tiene parte transparente (por defecto definida como falso).

La línea 2 asigna a la variable imagen la imagen a través de la función de Pygame pygame.image.load() si se puede sino, en la líneas 3 y 4 manejan el error y salen del programa.

La línea 5 convierte la imagen al tipo interno de Pygame que hace que sea mucho más eficiente.

Las línea 6 es un condicional que controla si el parámetro transparent es verdadero y en caso afirmativo ejecuta las líneas 7 y 8, la primera obtiene el color del pixel (0, 0) de la imagen (esquina superior izquierda) y la la línea 8 lo define como color transparente de la imagen. Es decir que si quieres una imagen con transparencia, el color que actúa como transparente se toma del pixel superior izquierdo, así que asegúrate que este color no está en la imagen.

Por último la línea 9 retorna la imagen después de todo el proceso.

El programa nos queda así:

#!/usr/bin/env python
# -*- coding: utf-8 -*-

# Módulos
import sys, pygame
from pygame.locals import *

# Constantes
WIDTH = 640
HEIGHT = 480

# Clases
# ---------------------------------------------------------------------

# ---------------------------------------------------------------------

# Funciones
# ---------------------------------------------------------------------

def load_image(filename, transparent=False):
        try: image = pygame.image.load(filename)
        except pygame.error, message:
                raise SystemExit, message
        image = image.convert()
        if transparent:
                color = image.get_at((0,0))
                image.set_colorkey(color, RLEACCEL)
        return image

# ---------------------------------------------------------------------

def main():
	screen = pygame.display.set_mode((WIDTH, HEIGHT))
	pygame.display.set_caption("Pruebas Pygame")
	while True:
		for eventos in pygame.event.get():
			if eventos.type == QUIT:
				sys.exit(0)
	return 0

if __name__ == '__main__':
	pygame.init()
	main()

Poniendo un fondo

Vamos a poner un fondo a nuestra ventana usando nuestra función load_image. Lo primero es descargar el fondo y guardarlo en la carpeta images del directorio de trabajo.

Para cargar la imagen usaremos la siguiente línea, la ponemos justo antes de entrar en el bucle del juego:

background_image = load_image('images/fondo.jpg')

Como ves no definimos color transparente, porque para el fondo no es necesario.

Ahora necesitamos "ponerla en la ventana" para ello dentro del bucle principal debemos definir que imagen poner y en que posición:

screen.blit(background_image, (0, 0))

Esto es lo que hace es poner la imagen la pantalla sobre las que había, recibe dos parámetros (en realidad algunos más), la imagen a poner y en que lugar situar la esquina superior izquierda de la imagen, en este caso (0, 0), es decir, queremos que la esquina superior izquierda de la imagen este en la posición (0, 0), con esto conseguimos que el fondo ocupe toda la ventana (si la imagen es mayor o superior a la ventana, claro está).

por último, como última línea del bucle debemos incluir la siguiente línea:

pygame.display.flip()

Esto lo que hace es actualizar toda la ventana para que se muestren los cambios que han sucedido.

El programa nos queda de la siguiente manera:

#!/usr/bin/env python
# -*- coding: utf-8 -*-

# Módulos
import sys, pygame
from pygame.locals import *

# Constantes
WIDTH = 640
HEIGHT = 480

# Clases
# ---------------------------------------------------------------------

# ---------------------------------------------------------------------

# Funciones
# ---------------------------------------------------------------------

def load_image(filename, transparent=False):
        try: image = pygame.image.load(filename)
        except pygame.error, message:
                raise SystemExit, message
        image = image.convert()
        if transparent:
                color = image.get_at((0,0))
                image.set_colorkey(color, RLEACCEL)
        return image

# ---------------------------------------------------------------------

def main():
	screen = pygame.display.set_mode((WIDTH, HEIGHT))
	pygame.display.set_caption("Pruebas Pygame")

	background_image = load_image('images/fondo.jpg')

	while True:
		for eventos in pygame.event.get():
			if eventos.type == QUIT:
				sys.exit(0)

		screen.blit(background_image, (0, 0))
		pygame.display.flip()
	return 0

if __name__ == '__main__':
	pygame.init()
	main()

Bien con esto hemos conseguido poner una imagen de fondo y tener una forma fácil de cargar imagenes en Pygame. Aconsejo guardar esto como plantilla base de Pygame, pues en casi todos los juegos necesitaremos cargar imagenes y establecer un fondo por defecto.

En el siguiente tutorial empezaremos a crear nuestro primer juego, un Pong, utilizando sptrites (imagenes con movimientos), colisiones entradas por teclado y demás cosas.

Entradas relacionadas

11 Comentarios

1
Escrito por Pygame IV: Creando Sprites | Razón Artificial el 14 febrero 2010 a las 20:46 pm

[...] parte 1, parte 2 y parte 3 nos sirvieron como introducción a Pygame, aprendimos a iniciar pygame, crear ventanas y poner [...]

2
Escrito por Tutorial Pygame | Razón Artificial « HiperEidon el 19 febrero 2010 a las 13:58 pm

[...] Pygame III: Cargar imágenes [...]

3
Escrito por El Gera el 2 marzo 2010 a las 9:13 am

Me podés aclarar unas dudas?
Primero, para qué son estas lineas…
#!/usr/bin/env python
# -*- coding: utf-8 -*-
…? Las saco y no pasa nada.

Y segundo, tengo que poner el path entero en el load_image, si pongo sólo “images\\fondo.jpg” tira error (uso windows).

4
Escrito por admin el 2 marzo 2010 a las 15:38 pm

La primera línea ejecuta python directamente sin tener que llamar al interprete, es decir: archivo.py en lugar de python archivo.py

La Segunda es la codificación de caracteres, utf-8, para poder poner tildes, eñes y demás.

Eso es porque no tienes la carpeta imágenes dentro del directorio del archivo.

5
Escrito por El Gera el 2 marzo 2010 a las 19:39 pm

Hola, gracias por responder.

Pero si saco esas líneas, no cambia nada cuando ejecuto el programa, aunque use eñes y tildes…

Y sí tengo un directorio images con un archivo fondo.jpg dentro, pero tengo que escribir la ruta completa en la función. “C:\\Python26\\proyectos\\pygame\\images\\fondo.jpg”, si pongo eso funciona (el archivo está en el directorio pygame). Creo que si el directorio estuviera en C:\ funcionaría sólo poniendo “images\\fondo.jpg”.

6
Escrito por brayan el 12 abril 2010 a las 22:54 pm

ola oe pygame esta muy chvr
oe una consulta
como puedo hacer para que mi imagen se extienda
en casi todo el fondo

7
Escrito por Dokan el 19 julio 2010 a las 16:01 pm

Es tontería responder a estas alturas la duda de los directorios, pero aún así por si sirve a alguien más.
Hace tiempo me encontré en una situación parecida usando windows, lo solucioné así; “..\images\fondo.jpg”, es la manera de que el sistema interprete que tiene que buscar a partir de la carpeta donde se ejecuta, si no se hace así hay que poner la ruta completa como le ha pasado a El Gera. Puede que me equivoque puesto que hace tiempo que no uso windows, pero creo recordar que era así.

8
Escrito por adrigm el 19 julio 2010 a las 16:05 pm

Dokan con ..\ le estás indicando que es el directorio padre, es decir fuera de la carpeta en la que esta nuestro archivo hay otra llamada images, y eso no es así, la carpeta images esta en el directorio que se encuentra el archivo por lo que lo correcto sería images\fondo.jpg

la única diferencia sería la barra invertida propia del sistema de Microsoft.

9
Escrito por neonigma el 20 julio 2010 a las 22:39 pm

Pero qué tutorial más útil y bien elaborado… ¡enhorabuena!

10
Escrito por Andrés el 20 agosto 2010 a las 16:57 pm

¿es necesario poner la imagen de fondo dentro del bucle eterno?

Me imagino que colocarla fuera del bucle mejoraría ligeramente el rendimiento, y en fin, el fondo no debe actualizarse cada vez

11
Escrito por adrigm el 20 agosto 2010 a las 18:17 pm

Andrés, sí que es necesario, tienes que saber como funciona el copiado de superficies para entenderlo. La ventana es una superficie y tu copias en ella otras superficies, si luego vuelves a copiar otra superficie encima (la pelota en otra posición, por ejemplo) la anterior no se borra, la forma de borrar la pantalla es volviendo a poner el fondo.

Prueba a sacar el fondo del bucle y verás.

Deja un comentario

Su comentario: