Utilizing Tiled Map Editor Without Slick2D

Started by ChaoticCactus, April 17, 2014, 03:09:40

Previous topic - Next topic

ChaoticCactus

Hey everybody!

I know that I can use Tiled Map Editor with Slick2D, but is there a way to use those maps with just LWJGL?  If there is how could I do it?

Please and thank you!  ;D

Cornix


ChaoticCactus

Ok.  So could I have some tips/examples on how I would do that, please?

Cornix

How much do you know about openGL?

In theory a tilemap is something very simple, as long as you know the OpenGL-Stuff it should not be too difficult.


In a 2D game (I assume you want to make something in 2D because of the tilemap) you usually have a fixed width and height for the tilemap viewport and only an x and y translation are changing.
When the translation changes you determine the range of tiles you need to render, the formula might be as simple as this:
/*
		 * Determine coordinates of tiles that will be drawn.
		 */		int fromX = translateX / tileWidth;
		int fromY = translateY / tileHeight;
		int toX = (int) ((translateX + viewportWidth) / tileWidth);
		int toY = (int) ((translateY + viewportHeight) / tileHeight);
		if (toX >= mapWidth) {
			toX = mapWidth;
		}
		if (toY >= mapHeight) {
			toY = mapHeight;
		}
		
		float remainderX = Math.abs(translateX % tileWidth);
		float remainderY = Math.abs(translateY % tileHeight);
		
		/*
		 * These are the coordinates (in pixels) of where the next tile will be drawn.
		 */
		float drawX = -scrollRemainderX;
		float drawY = 0;
		float drawFx = drawX + mapTileWidth;
		float drawFy = drawY + mapTileHeight;
		
		/*
		 * Iterate over all visible tiles and draw them one by one
		 */
		for (int x = fromX; x <= toX; x++) {
			drawY = -scrollRemainderY;
			drawFy = drawY + mapTileHeight;
			for (int y = fromY; y <= toY; y++) {
				Tile tile = getTileAt(x, y);
				
				drawTile(tile, drawX, drawY, drawFx, drawFy);
				
				drawY += mapTileHeight;
				drawFy = drawY + mapTileHeight;
			}
			drawX += mapTileWidth;
			drawFx = drawX + mapTileWidth;
		}

fromX := X-Coordinate (in tilemap coordinates) of the first visible tile
fromY := Y-Coordinate (in tilemap coordinates) of the first visible tile
toX := X-Coordinate (in tilemap coordinates) of the last visible tile
toY := Y-Coordinate (in tilemap coordinates) of the last visible tile

drawX := X-Coordinate (in pixels on canvas) of the next tile that is supposed to be drawn
drawY := Y-Coordinate (in pixels on canvas) of the next tile that is supposed to be drawn
drawFx := X-Coordinate (in pixels on canvas) of the lower right corner of the next tile that is supposed to be drawn
drawFy := Y-Coordinate (in pixels on canvas) of the lower right corner of the next tile that is supposed to be drawn


This code was taken from one of my earlier works. It assumes the origin of the canvas is the upper left. draw coordinates are in pixels on the canvas.
As long as you know how to draw a tile it will be pretty simple to start from here.

The drawTile method might use Immediate mode (in this case add glBegin / glEnd around the loop) or update the vertices in a VBO or draw to a texture or whatever.

I hope this helps.

ChaoticCactus


ChaoticCactus

Actually, I looked over this again and I'm not sure I entirely understand.  Does that use the mapeditor (http://www.mapeditor.org/) that I'm talking about?  Because that's my goal, sorry if I wasn't specific enough.  And yeah, I'm not all that familiar with opengl  ???

Cornix

No, this does not use any map editor at all.
This is just a very basic framework for implementing your own Tilemap class. You have to parse map data yourself and somehow represent it with an apropriate class of your own.

quew8

All of the Slick code is open source on Github isn't it? You should be able to figure out parsing the file from there.