How can I give the tiles in my tilemap a sprite?

user_12215910 0
Viewed 133

I am quite new to Python and this is quite a newbie question, but how can I assigne the tiles in my tilemap sprites? Currently, I am just drawing rectangles in the tilemap where they are supposed to be, and it works fine. However, I want to add my own textures.

import pygame
pygame.init()

tilesize = 64
mapwidth, mapheight = 20, 13
screen = pygame.display.set_mode((mapwidth*tilesize, mapheight*tilesize))

WALLTOP, WALLBOT, GRASS = range(3)
wallTop = (0, 102, 0)
wallBot = (51, 51, 0,)
grass =   (0, 65, 0)

colors = {
    WALLTOP : wallTop,
    WALLBOT : wallBot,
    GRASS   : grass
}

# Tilemap
tilemap = [
    [WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP],
    [WALLTOP, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLBOT, WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   WALLTOP, WALLTOP, WALLTOP, GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   WALLTOP, WALLTOP, WALLBOT, GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   WALLBOT, WALLBOT, GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS,   GRASS, GRASS,   GRASS,   GRASS,   GRASS,     WALLTOP],
    [WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP, WALLTOP],

# Main loop
running = True
while running:
    # Loop through the rows of the tilemap
    for row in range(mapheight):
        # Loop through the columns of the tilemap
        for column in range(mapwidth):
            # Draw the picture at the position in the tilemap
            pygame.draw.rect(screen, colors[tilemap[row][column]], (column*tilesize, row*tilesize, tilesize, tilesize))

    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            running = False

    pygame.display.update()
sprite pygame python
1 Answers

Replace drawing rect with blitting images corresponding to each element of the map.

Replace the colors dict and the color definitions with a dictionary like this:

tileimages = {
    WALLTOP : pygame.image.load("path/to/image_walltop.png").convert(),
    WALLBOT : pygame.image.load("path/to/image_wallbot.png").convert(),
    GRASS   : pygame.image.load("path/to/image_grass.png").convert(),
}

pygame.image.load will load an image, which of course needs to be prepared in advance with an image editor or whatever and stored somewhere on your system. Be sure to provide the correct path.
Here I used png, but could be other formats, for more info on supported formats read the documentation I linked.

To blit the image, in your mainloop replace the draw.rect line with:

screen.blit(tileimages[tilemap[row][column]], (column*tilesize, row*tilesize))

Careful: here is assumed that the images have the correct size, so it is a tilesize x tilesize image (which becomes a tilesize x tilesize Surface in pygame). If this is not the case, the result will be bad. You need to use pygame.transform.scale to rescale it to a tilesize x tilesize Surface.

So your tileimages dict should look like:

tileimages = {
    WALLTOP : pygame.transform.scale(pygame.image.load("path/to/image_walltop.png").convert(), (tilesize, tilesize)),
    WALLBOT : pygame.transform.scale(pygame.image.load("path/to/image_wallbot.png").convert(), (tilesize, tilesize)),
    GRASS   : pygame.transform.scale(pygame.image.load("path/to/image_grass.png").convert(), (tilesize, tilesize)),
}
user_104260370
Related