Tile Systemed 2D RPG - GameCreators Forum

Author

Message

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 27th May 2008 08:19

Link

Hey guys.. I have been looking around the forums here in search of a basic tutorial on the "Concept of Tiled based RPGs". I haven't found anything yet. I was wondering if you guys can either explain to me the concept of how it works, or provide some links to a good website. I do know basic c++ game programming and a lot of c++ theory, but I just couldn't find a way to go at making a tile-based RPG in conjunction with DarkGDK. Thanks for any help.

Back to top

Profile PM Email

jezza

16

Years of Service

User Offline

Joined: 8th Mar 2008

Location: Bham, UK

Posted: 27th May 2008 10:51

Link

You have a 2D array, each element of which has a sprite.

Back to top

Profile PM Email

deadlyduck

22

Years of Service

User Offline

Joined: 19th Sep 2002

Location: United Kingdom

Posted: 27th May 2008 15:55 Edited at: 27th May 2008 15:56

Link

set up a 2 dimensional array,
each element of the array represents a sprite as jezza said.

for example

+ Code Snippet

################
#T    #T   #T  #
#     #    #   #
###D#####D###D##
D              D
#####D######D###
#        #     #
#        #     #
#TC      #  T  #
################

here I am using:-
# = wall, you would have an appropriate sprite '16x16, 32x32, 64x64 whatever the size of your sprites are'

D = a door, you may have to set up multiple doors for different directions

T = a table
C = a chair
etc. etc.

you can have your 2d array as big as you want within memory restraints.

your map will proly have more than 4 sprites else it will be a pretty boring map.

you may want to have more than one layer to your map as well,
so you can have different floor tiles, maybe put roofs on your buildings when outside them etc.

some of your sprites may be bigger than the normal,
ie. if your walls are 32x32 it may look good if your trees where 40x40, you would have to place the sprite in the middle of the tile and depending on how you decide on drawing them may have to use a 2 pass process or put the leaves on a higer layer to make them look right.

There are loads of different ways of doing a tiled sprite game, you can proly even find free tiled sprite map creators out there in internet land.

I made one years ago on the Atari ST/Falcon
http://www.deadly.clara.net/ADV.html

I realy am going to have to update my website one of these days

http://www.deadly.clara.net/

Back to top

Profile PM Email Website

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 27th May 2008 22:23 Edited at: 27th May 2008 23:56

Link

Ok, I get the map concept. Thank you both.

EDIT: I figured out how to read/write from text files.

(Important)
Ok so I looked some other people's code and I understand the 2D Array. But I can't seem to get the draw to work. Can someone give me a basic example of what the code actually is.

+ Code Snippet

int TownA[10][10]=
       {{1,1,1,1,1,1,1,1},
	{1,2,2,1,2,2,2,1},
	{1,2,2,1,2,2,2,1},
	{1,2,2,1,2,2,2,1},
	{1,2,2,1,2,2,2,1},
	{1,2,2,1,2,2,2,1},
	{1,2,2,2,2,2,2,1},
	{1,2,2,2,2,2,2,1}};

Ok, so here is my code.

game.cpp This draws picture 1.

#include "functions.h"

//////////////////////
// INITIATE //////////
//////////////////////

void Init()
{
	dbSyncOn();
	dbSetDisplayMode(SCREENWIDTH,SCREENHEIGHT, DISDEPTH);
	InitLoadObjImages();
	InitLoadMapImages();
}

void InitLoadObjImages()
{
}

void InitLoadMapImages()
{
   dbLoadImage("Grass.bmp", 2);
   dbLoadImage("Wall.bmp", 1);
   dbLoadImage("Dirt.bmp", 3);
}

////////////////////
// Map /////////////
////////////////////

void drawMap(int TX, int TY)
{
	int a = DEFMAPMIN;
	int b = OBJMAPMIN;
	int x = TX;
	int y = TY;
	int z = 0;
	int SCREENPOSITIONX = 0;
	int SCREENPOSITIONY = 0;
	int (*MapArray) [10];

MapArray = firstTown;

if(MapArray[y][x]==1)
	{
	dbSprite(1, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
	}
	if(MapArray[y][x]==2)
	{
	dbSprite(2, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
	}
	if(MapArray[y][x]==3)
	{
	dbSprite(3, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
	}

}

///////////////////
// GAME ///////////
///////////////////

void DarkGDK()
{
	Init();
	while(LoopGDK())
	{
		drawMap(TX,TY);
		dbSync();
	}
}

+ Code Snippet

#include "functions.h"

//////////////////////
// INITIATE //////////
//////////////////////

void Init()
{
	dbSyncOn();
	dbSetDisplayMode(SCREENWIDTH,SCREENHEIGHT, DISDEPTH);
	InitLoadObjImages();
	InitLoadMapImages();
}

void InitLoadObjImages()
{
}

void InitLoadMapImages()
{
   dbLoadImage("Grass.bmp", 2);
   dbLoadImage("Wall.bmp", 1);
   dbLoadImage("Dirt.bmp", 3);
}

////////////////////
// Map /////////////
////////////////////


void drawMap(int TX, int TY)
{
	int a = DEFMAPMIN;
	int b = OBJMAPMIN;
	int x = TX;
	int y = TY;
	int z = 0;
	int SCREENPOSITIONX = 0;
	int SCREENPOSITIONY = 0;
	int (*MapArray) [10];

	MapArray = firstTown;

        if(MapArray[y][x]==1)
	{
	dbSprite(1, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
	}
	if(MapArray[y][x]==2)
	{
	dbSprite(2, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
	}
	if(MapArray[y][x]==3)
	{
	dbSprite(3, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
	}

}

///////////////////
// GAME ///////////
///////////////////

void DarkGDK()
{
	Init();
	while(LoopGDK())
	{
		drawMap(TX,TY);
		dbSync();
	}
}

game.cpp EDIT: This is my new one to try and make it draw each array point, but all it does is draw the grass tile instead of the wall.
Picture 2

#include "functions.h"

//////////////////////
// INITIATE //////////
//////////////////////

void Init()
{
	dbSyncOn();
	dbSetDisplayMode(SCREENWIDTH,SCREENHEIGHT, DISDEPTH);
	InitLoadObjImages();
	InitLoadMapImages();
}

void InitLoadObjImages()
{
}

void InitLoadMapImages()
{
   dbLoadImage("Grass.bmp", 2);
   dbLoadImage("Wall.bmp", 1);
   dbLoadImage("Dirt.bmp", 3);
}

////////////////////
// Map /////////////
////////////////////

void drawMap(int TX, int TY)
{
	int a = DEFMAPMIN;
	int b = OBJMAPMIN;
	int x = TX;
	int y = TY;
	int z = 0;
	int SCREENPOSITIONX = 0;
	int SCREENPOSITIONY = 0;
	int (*MapArray) [10];

MapArray = firstTown;

for (int x=0; x<8; x = x++)
	{
		for (int y=0; y<8; y++)
		{
			if(MapArray[y][x]==1)
			{
				dbSprite(1, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
			}
			if(MapArray[y][x]==2)
			{
				dbSprite(2, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
			}
			if(MapArray[y][x]==3)
			{
				dbSprite(3, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
			}

}
	}
}

///////////////////
// GAME ///////////
///////////////////

void DarkGDK()
{
	Init();
	while(LoopGDK())
	{
		drawMap(TX,TY);
		dbSync();
	}
}

+ Code Snippet

#include "functions.h"

//////////////////////
// INITIATE //////////
//////////////////////

void Init()
{
	dbSyncOn();
	dbSetDisplayMode(SCREENWIDTH,SCREENHEIGHT, DISDEPTH);
	InitLoadObjImages();
	InitLoadMapImages();
}

void InitLoadObjImages()
{
}

void InitLoadMapImages()
{
   dbLoadImage("Grass.bmp", 2);
   dbLoadImage("Wall.bmp", 1);
   dbLoadImage("Dirt.bmp", 3);
}

////////////////////
// Map /////////////
////////////////////


void drawMap(int TX, int TY)
{
	int a = DEFMAPMIN;
	int b = OBJMAPMIN;
	int x = TX;
	int y = TY;
	int z = 0;
	int SCREENPOSITIONX = 0;
	int SCREENPOSITIONY = 0;
	int (*MapArray) [10];

	MapArray = firstTown;

	for (int x=0; x<8; x = x++)
	{
		for (int y=0; y<8; y++)
		{
			if(MapArray[y][x]==1)
			{
				dbSprite(1, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
			}
			if(MapArray[y][x]==2)
			{
				dbSprite(2, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
			}
			if(MapArray[y][x]==3)
			{
				dbSprite(3, SCREENPOSITIONX, SCREENPOSITIONY, MapArray[y][x]);
			}

		}
	}
}

///////////////////
// GAME ///////////
///////////////////

void DarkGDK()
{
	Init();
	while(LoopGDK())
	{
		drawMap(TX,TY);
		dbSync();
	}
}

And here is my functions.h file

+ Code Snippet

#include "DarkGDK.h"


////////////////////
// GLOBALS /////////
////////////////////

int TX=0,TY=0;

////////////////////
// DEFINITIONS /////
////////////////////

#define PLAYERSPRITEID 1
#define PLAYERIMAGEID 1
#define PLAYERIMAGEFILE "images/Wizard.bmp"

#define SCREENHEIGHT 200
#define SCREENWIDTH 200
#define DISDEPTH 32

#define DEFMAPMIN 100
#define OBJMAPMIN 200

////////////////////
// INIT ////////////
////////////////////

void Init();
void InitLoadObjImages();
void InitLoadMapImages();

////////////////////
// GAME ////////////
////////////////////

void DarkGDK();

////////////////////
// MAP /////////////
////////////////////

//enum ZoneID{firstTown);
//ZoneID iZoneID;

int firstTown[10][10]=
   {{1,1,1,1,1,1,1,1},
	{1,2,2,2,2,2,2,1},
	{1,2,2,2,2,2,2,1},
	{1,2,2,2,2,2,2,1},
	{1,2,2,2,2,2,2,1},
	{1,2,2,2,2,2,2,1},
	{1,2,2,2,2,2,2,1},
	{1,2,2,2,2,2,2,1}};

void drawMap(int TX, int TY);

Picture 1.

Picture2

EDIT: Ok, so I figured out how to somewhat draw the tiles. But I have a problem when I run them. The first one draws the correct tile, but only draws the top left one. And the second one draws the wrong tile, and only draws the top left one. If someone can tell me where i am going wrong or how draw the full array correctly i would appreciate it.

Back to top

Profile PM Email

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 27th May 2008 23:20 Edited at: 28th May 2008 00:25

Link

Delete

Back to top

Profile PM Email

waka324

16

Years of Service

User Offline

Joined: 31st Mar 2008

Location:

Posted: 28th May 2008 09:12

Link

It looks to me as though you have two problems. Firstly, in your for loop to create the tiling, SCREENPOSITIONX and SCREENPOSITIONY don't change, so all your sprites will be created at 0, 0. secondly, each sprite needs it's own individual id#, otherwise the sprites simply change their image. so when
dbSprite(sprite id, x, y, image number ), make sure for each tile, sprite id, x, and y is changed.

I had to do this sometime earlier, and I could actually provide my code for drawing a map if you wish.

Back to top

Profile PM

waka324

16

Years of Service

User Offline

Joined: 31st Mar 2008

Location:

Posted: 28th May 2008 09:24

Link

on second thought, here it is...

this draws the map from preloaded images corresponding to values from tilemap[x][y]. in this case, it makes a 20 tile wide by 14 tile high map of 32x32 px images. it should be self explanatory.

+ Code Snippet

void drawmap()
{

int n=0

	for(int y=0; y<15; ++y)
	{

			for(int x=0; x<20; ++x)
	{	

		if(tilemap[x][y]!=0)
		{
	dbSprite(n, (32*x), (32*y), tilemap[x][y]);
		dbSetSpritePriority(n,0);
++n;
		}
	}


	}


}
	dbSync();



}

Back to top

Profile PM

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 30th May 2008 17:20

Link

WOW!!!! Thank you so much. I have been trying to get this to work for so many hours. I finally understand how this works!!! I hope that other people with this problem check out your coding. Although you did have some mistakes in your code. Here is what i ended up with, to draw the map.

This is the map that i wanted to draw.

+ Code Snippet

int firstTown[10][10]=
   {{w,w,w,w,w,w,w,w,w,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w},
	{w,g,g,g,g,g,g,g,g,w}};

Drawcode

+ Code Snippet

void drawMap()
{

int n = 0; //This needed a ";" at the end.
int (*tilemap) [10]; // Added these in to tell the
tilemap = firstTown; // draw code what map to load
	
        for(int x = 0; x < 10; x++)//Don't know why I changed x and 
	{                          // the y around

		for(int y = 0; y < 11; y++)
		{	
			if(tilemap[x][y]!=0)
			{	
				dbSprite(n, (32 * x), (32 * y), tilemap[x][y]);
				dbSetSpritePriority(n,0);
				n++;
			}
		}

	}
        // Took out an extra "}" here.
	dbSync();
}

Also it the map is rotated 270 degrees clockwise 90 degrees counter-clockwise, and the coordinate 0,0 or 1,1 I'm not sure which one, doesn't draw. Have any explanation on why this is?

Back to top

Profile PM Email

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 2nd Jun 2008 15:35 Edited at: 2nd Jun 2008 15:44

Link

I think the rotation has to do with how the arrays are actually set up.

/*================================================*\
| Lead Programmer/Owner===============Anti-Triangle Cult=====|
\*================================================*/

Back to top

Profile PM Email

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 4th Jun 2008 02:37 Edited at: 4th Jun 2008 02:38

Link

I figure out the reason that it wasn't drawing coordinate 0,0. its because of the code x = 0; y = 0; and the if statement != 0; I ended up with a final code of this.

+ Code Snippet

void drawMap()
{

int n = 0; //This needed a ";" at the end.
int (*tilemap) [10]; // Added these in to tell the
tilemap = firstTown; // draw code what map to load
	
        for(int x = -1; x < 10; x++)//Don't know why I changed x                                                                                        
	 {                          // the y around
                                    //Change to -1
		for(int y = -1; y < 11; y++) //Changed to -1
		{	
			if(tilemap[x][y]!= -1) //Changed to -1
			{	
				dbSprite(n, (32 * x), (32 * y), tilemap[x][y]);
				dbSetSpritePriority(n,0);
				n++;
			}
		}

	}
        // Took out an extra "}" here.
	dbSync();
}

I changed the x = 0; to x = -1;
I changed the y = 0; to y = -1;
I changed the if(tilemap[x][y]!= 0) to if(tilemap[x][y]!= -1)

Thanks

/*================================================*\
| Lead Programmer/Owner===============Anti-Triangle Cult=====|
\*================================================*/

Back to top

Profile PM Email

Zuka

16

Years of Service

User Offline

Joined: 21st Apr 2008

Location: They locked me in the insane asylum.

Posted: 4th Jun 2008 06:08

Link

First of all, I wouldn't call dbSync() in any function but the main one.

If you can do any models for FW, reply to the FleetWars thread.

Click here!

Back to top

Profile PM

jason p sage

17

Years of Service

User Offline

Joined: 10th Jun 2007

Location: Ellington, CT USA

Posted: 4th Jun 2008 17:14

Link

Zuka... why? LOL - that's a good mantra - but there are reasons to do - call dbsync that is... sometimes 2 times in a row!

http://www.jasonpetersage.com/?PAGE=ironinfantry&SECTION=ironinfantry

Back to top

Profile PM Email Website

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 4th Jun 2008 20:14

Link

Yah if you can explain why... I will probably remove it, but right now it is working just how I want it to. So for now I will keep it in their.

/*================================================*\
| Lead Programmer/Owner===============Anti-Triangle Cult=====|
\*================================================*/

Back to top

Profile PM Email

Zuka

16

Years of Service

User Offline

Joined: 21st Apr 2008

Location: They locked me in the insane asylum.

Posted: 4th Jun 2008 21:04

Link

If it works, keep it. I thought there would be some problems if you ever wanted to do dbCls or something like that.

If you can do any models for FW, reply to the FleetWars thread.

Click here!

Back to top

Profile PM

elantzb

16

Years of Service

User Offline

Joined: 10th May 2008

Location: Classified

Posted: 5th Jun 2008 07:03

Link

this is what the game i'm making is all about-

in fact, i notice that you borrowed my code.

i'm flattered.

if you want your map to be unflipped, replace tilemap[x][y] with tilemap[y][x].

DEFMAPMIN and OBJMAPMIN are #defined integers that keep track of the IDs of each tile. DEFMAPMIN would be 100 and OBJMAPMIN would be 200.

so after:

+ Code Snippet

int a = DEFMAPMIN;
int b = OBJMAPMIN;

you would use a and b as the IDs for different tiles, incrementing them after the pasting of each tile.

By doing this, you know what ranges of IDs to check when you calculate collision with different tiles.

my current drawmap function is as follows:

bool rpgDrawMap(int iTopX, int iTopY)
{
	if(g_mapDrawn)
		return 0;
	dbCLS(RGB(0,50,0));

int n = NPCIDMIN;
	int i = DEFMAPMIN;
	int o = OBMAPMIN;
	int t = TELMAPMIN;
	int x = iTopX;
	int y = iTopY;
	//int z = 0;
	int ScrnPosX = 0;
	int ScrnPosY = 0;
	float (*MapArray)[100];

ClearDrawMapArrays();
	ChooseMap(&MapArray);

while(MapArray[y][x]&&x<iTopX+10&&ScrnPosX<dbScreenWidth())
	{
		while(MapArray[y][x]&&y<iTopY+10&&ScrnPosY<dbScreenHeight())
		{
			if(g_fCurrentNPCArray[y][x]>=0)
			{
				initNPC((int)g_fCurrentNPCArray[y][x],ScrnPosX,ScrnPosY,n);
				n++;
			}
			if(MapArray[y][x]==2||
				CheckOffset((float)MapArray[y][x],0.1))
			{
				PasteTile(MapArray[y][x],MAPIMAGEID,t,ScrnPosX,ScrnPosY);
				t++;
				ScrnPosY+=32;
				y++;
				continue;
			}

if(MapArray[y][x]<=50|| 
				CheckOffset((float)MapArray[y][x],0.2))
			{
				if(i>DEFMAPMIN+19||!DEBUG)
				{
					PasteTile(MapArray[y][x],MAPIMAGEID,i,ScrnPosX,ScrnPosY);
				}
				i++;
				ScrnPosY+=32;
				y++;
				continue;
			}

if(MapArray[y][x]>50 && MapArray[y][x]<=100)
			{
				if(o>OBMAPMIN+5||!DEBUG)
				{
					PasteTile(MapArray[y][x],MAPIMAGEID,o,ScrnPosX,ScrnPosY);
				}
				o++;
				ScrnPosY+=32;
				y++;
				continue;
			}
		}
		ScrnPosX+=32;
		ScrnPosY = 0;
		y=iTopY;
		x++;
	}
	g_mapDrawn=1;
	return 1;
}

+ Code Snippet

bool rpgDrawMap(int iTopX, int iTopY)
{
	if(g_mapDrawn)
		return 0;
	dbCLS(RGB(0,50,0));

	int n = NPCIDMIN;
	int i = DEFMAPMIN;
	int o = OBMAPMIN;
	int t = TELMAPMIN;
	int x = iTopX;
	int y = iTopY;
	//int z = 0;
	int ScrnPosX = 0;
	int ScrnPosY = 0;
	float (*MapArray)[100];

	ClearDrawMapArrays();
	ChooseMap(&MapArray);

	while(MapArray[y][x]&&x<iTopX+10&&ScrnPosX<dbScreenWidth())
	{
		while(MapArray[y][x]&&y<iTopY+10&&ScrnPosY<dbScreenHeight())
		{
			if(g_fCurrentNPCArray[y][x]>=0)
			{
				initNPC((int)g_fCurrentNPCArray[y][x],ScrnPosX,ScrnPosY,n);
				n++;
			}
			if(MapArray[y][x]==2||
				CheckOffset((float)MapArray[y][x],0.1))
			{
				PasteTile(MapArray[y][x],MAPIMAGEID,t,ScrnPosX,ScrnPosY);
				t++;
				ScrnPosY+=32;
				y++;
				continue;
			}

			if(MapArray[y][x]<=50|| 
				CheckOffset((float)MapArray[y][x],0.2))
			{
				if(i>DEFMAPMIN+19||!DEBUG)
				{
					PasteTile(MapArray[y][x],MAPIMAGEID,i,ScrnPosX,ScrnPosY);
				}
				i++;
				ScrnPosY+=32;
				y++;
				continue;
			}

			if(MapArray[y][x]>50 && MapArray[y][x]<=100)
			{
				if(o>OBMAPMIN+5||!DEBUG)
				{
					PasteTile(MapArray[y][x],MAPIMAGEID,o,ScrnPosX,ScrnPosY);
				}
				o++;
				ScrnPosY+=32;
				y++;
				continue;
			}
		}
		ScrnPosX+=32;
		ScrnPosY = 0;
		y=iTopY;
		x++;
	}
	g_mapDrawn=1;
	return 1;
}

ask me any questions you have.

Back to top

Profile PM Email Website

elantzb

16

Years of Service

User Offline

Joined: 10th May 2008

Location: Classified

Posted: 5th Jun 2008 07:06

Link

I like what you did with the way you calculate the positioning of each tile, by the way.

Back to top

Profile PM Email Website

Spooter

16

Years of Service

User Offline

Joined: 27th May 2008

Location:

Posted: 5th Jun 2008 19:51

Link

Yah, I used your code because I didn't know where to start. I actually stopped work on my rpg game, but I am sure that I will use your code in the future, or in my new game.

/*================================================*\
| Lead Programmer/Owner===============Anti-Triangle Cult=====|
\*================================================*/

Back to top

Profile PM Email

Sorry your browser is not supported!

Dark GDK / Tile Systemed 2D RPG