Tiled JSON Map Loader Example Code Available

Someone asked me for the source code for the JSON map loader example I created for a video tutorial on using Tiled to export 2d tile maps as JSON map files. Although .tmx is a more popular format, Pygame Subset for Android does not support the xml parser libraries.  Because of this, we can't use the TMX Loader library available on the Pygame site.  Pytmxloader also will not work.  This is unfortunate since the pytmxloader is especially nice.  Although these libraries will work on the desktop.  They will not work on the Android phone.  :-(

At some point, I was planning to write a library for JSON map file loading.  However, I never got around to it.  The code below will work on desktop and mobile phones.  It is for educational purposes only.

JSON Map Loader Lesson Code that works with Tiled maps.

import json, pygame, sys try: import android except ImportError: android = None class Tile(pygame.sprite.Sprite): def __init__(self, image): pygame.sprite.Sprite.__init__(self) self.image = image self.rect = self.image.get_rect() self.speed = 2 self.currentx = -100 self.currenty = -100 def update(self, direction, mapborder): borderx = mapborder[0] bordery = mapborder[1] if direction == "right" and self.currentx > borderx: self.rect.left -= self.speed self.currentx -= self.speed elif direction == "left" and self.currentx < 0: self.rect.right += self.speed self.currentx += self.speed elif direction == "up" and self.currenty < 0: self.rect.top += self.speed self.currenty += self.speed elif direction == "down" and self.currenty > bordery: self.rect.bottom -= self.speed self.currenty -= self.speed class Player(pygame.sprite.Sprite): def __init__(self, image, center): pygame.sprite.Sprite.__init__(self) self.image = pygame.image.load(image) self.rect = self.image.get_rect() self.rect.center = center def event_handler(event_list, direction): for event in event_list: if event.type == pygame.KEYDOWN: if event.key == pygame.K_RIGHT: direction = "right" elif event.key == pygame.K_LEFT: direction = "left" elif event.key == pygame.K_UP: direction = "up" elif event.key == pygame.K_DOWN: direction = "down" elif event.key == pygame.K_SPACE: direction = "stop" elif event.key == pygame.K_ESCAPE: pygame.quit() sys.exit() elif event.type == pygame.MOUSEBUTTONDOWN: mouse_pos = pygame.mouse.get_pos() mousex = mouse_pos[0] mousey = mouse_pos[1] if mousex > 380: direction = "right" elif mousex < 100: direction = "left" elif mousey < 100: direction = "up" elif mousey > 220: direction = "down" return(direction) pygame.init() if android: android.init() android.map_key(android.KEYCODE_BACK, pygame.K_ESCAPE) FPS = 50 clock = pygame.time.Clock() SCREENWIDTH = 480 SCREENHEIGHT = 320 SCREENSIZE = ((SCREENWIDTH, SCREENHEIGHT)) screen = pygame.display.set_mode((SCREENSIZE)) pygame.display.set_caption("Pygame 2D tile game example") mapfile = open("map4.json").read() mapdict = json.loads(mapfile) tilesets = mapdict["tilesets"] layers = mapdict["layers"] height = mapdict["height"] width = mapdict["width"] all_tiles_from_sets = [] for tileset in tilesets: tileset_image = pygame.image.load(tileset["image"]) imageheight = tileset["imageheight"] imagewidth = tileset["imagewidth"] tilewidth = tileset["tilewidth"] tileheight = tileset["tileheight"] for y in range(0, imageheight, tileheight): for x in range (0, imagewidth, tilewidth): tile = pygame.Surface((tilewidth, tileheight)) tile.blit(tileset_image, (0,0), (x, y, tilewidth, tileheight)) all_tiles_from_sets.append(tile) all_layers = [] initial_map_pos = (-100, -100) collision_layers = [] for layer in layers: data = layer["data"] layerheight = layer["height"] layerwidth = layer["width"] current_layer = pygame.sprite.Group() properties = layer["properties"] try: collision = properties["collision"] except KeyError: collision = 0 collision_layers.append(collision) data_pos = 0 for y in range (0, layerheight): for x in range (0, layerwidth): gid = data[data_pos] if gid > 0: tile = Tile(all_tiles_from_sets[gid - 1]) tilex = (x * tilewidth) + initial_map_pos[0] tiley = y * tileheight + initial_map_pos[1] tile.rect.topleft = (tilex, tiley) tile.image.set_colorkey((0,0,0)) current_layer.add(tile) data_pos += 1 all_layers.append(current_layer) direction = "stop" screen_center = screen.get_rect().center player = Player("boy.png", screen_center) collide = False prev_direction = "stop" layer_width = layers[0]["width"] * tilesets[0]["tilewidth"] layer_height = layers[0]["height"] * tilesets[0]["tileheight"] layersize = (layer_width, layer_height) mapborderx = SCREENSIZE[0] - layer_width mapbordery = SCREENSIZE[1] - layer_height mapborder = (mapborderx, mapbordery) while True: event_list = pygame.event.get() for event in event_list: if event.type == pygame.QUIT: pygame.quit() sys.exit() direction = event_handler(event_list, direction) if prev_direction == direction and collide: direction = "stop" else: collide = False screen.fill((0,0,0)) layer_pos = 0 for layer in all_layers: layer.update(direction, mapborder) layer.draw(screen) if int(collision_layers[layer_pos]) == 1: if pygame.sprite.spritecollideany(player, current_layer): if direction != "stop": prev_direction = direction direction = "stop" collide = True layer_pos += 1 screen.blit(player.image, player.rect) clock.tick(FPS) pygame.display.update()