Map Editor implementation

Previous topic - Next topic

xxbastianxx

Hey guys,

I'd like to implement a map editor in my jump and run... I cant find that in the help section of GL Basic...

could someone give me an example ? And is it maybe possible that there is a tool for that ?

TY

MrTAToad

Mappy is pretty good, but the file format is awful.  However, there are a few routines around here that will load and display the files.

Ian Price

Creating your own map editor is not difficult as long as you understand how to use and manipulate the arrays that will hold your level data.

A simple editor could be something like this

Code (glbasic) Select

// --------------------------------- //
// Project: simple_map_editor
// Start: Monday, March 04, 2013
// IDE Version: 10.283


SETCURRENTDIR("Media") // go to media files

SETSCREEN 640,480,0

GLOBAL map%[]
GLOBAL colour%[]

DIM map[20][15]

DIM colour[10]

colour[0]=RGB(0,0,0)
colour[1]=RGB(255,0,0)
colour[2]=RGB(0,255,0)
colour[3]=RGB(0,0,255)
colour[4]=RGB(255,255,255)
colour[5]=RGB(255,0,255)
colour[6]=RGB(255,255,0)
colour[7]=RGB(0,255,255)

SYSTEMPOINTER TRUE


main()


// Main function
FUNCTION main:

LOCAL mx%, my%, b1%, b2%, cx%, cy%, gfx%

WHILE TRUE

// Tiles
FOR n=0 TO 7
  DRAWRECT n*32,0,32,32,colour[n]
NEXT

PRINT "LOAD",320,16
PRINT "SAVE",384,16
PRINT "NEW",448,16

// Mouse position
MOUSESTATE mx,my,b1,b2

// Cursor position
cx=mx/32
cy=my/32


// Select options
IF b1 AND cy=0
  IF cx<8 THEN gfx=cx        // Pick tile
  IF cx=10 THEN load_data() // Load data
  IF cx=12 THEN save_data() // Save data
  IF cx=14 THEN clear_data() // Clear data
ENDIF 


// Draw screen
FOR y=1 TO 14
FOR x=0 TO 19
  DRAWLINE x*32,32,x*32,480,RGB(64,64,64)
  DRAWLINE 0,y*32,640,y*32,RGB(64,64,64)
 
  IF map[x][y]>0 THEN DRAWRECT x*32,y*32,32,32,colour[map[x][y]]
 
  PRINT map[x][y],x*32,y*32
 
NEXT
NEXT



// Paint with colour onto map
IF b1 AND cy>0 THEN map[cx][cy]=gfx



SHOWSCREEN

WEND

ENDFUNCTION


// Clear data
FUNCTION clear_data:

FOR y=0 TO 14
FOR x=0 TO 19
  map[x][y]=0
NEXT
NEXT

ENDFUNCTION


// Load map data
FUNCTION load_data:

LOCAL file$, ok%

file$="level.dat"

ok=DOESFILEEXIST(file$)

IF ok

  OPENFILE (1,file$,1)

   FOR y=0 TO 14
   FOR x=0 TO 19
    READWORD 1,map[x][y]
   NEXT
   NEXT

  CLOSEFILE 1
ENDIF

ENDFUNCTION


// Save map data
FUNCTION save_data:

LOCAL file$

file$="level.dat"

OPENFILE (1,file$,0)

FOR y=0 TO 14
FOR x=0 TO 19
  WRITEWORD 1,map[x][y]
NEXT
NEXT

CLOSEFILE 1

ENDFUNCTION


This code shows a number of important features in a map editor, including -
- Storing map data in an array
- Using array data to display a map
- Saving the array
- Loading the array

It's simple, but it works. This code can easily be adapted to use sprites instead of rectangles.
I came. I saw. I played.

spacefractal

#3
I use tiles:
http://www.mapeditor.org/

This one uses XML format (don't save in compressed format), but was quite easy to read it for those features I want to use.

Alternative, try this one (EzMap - GLBasic coded Map Editor):
http://www.glbasic.com/forum/index.php?topic=8721.0
Genius.Greedy Mouse - Karma Miwa - Spot Race - CatchOut - PowerUp Elevation - The beagle Jam - Cave Heroes 2023 - https://spacefractal.itch.io/

fivesprites

One very simple approach is to use an image to represent your level.  Each pixel represents one tile.  The colour of the pixel indicates the type of tile.

If you need to have more complex layers then you could have further images that represent other information, such as entity locations.

The images are tiny (often a lot less storage space used than XML output from other editors) and it's really easy to implement.

Take a look at the LOADSPRITEMEM() function - this will allow you to read an image into memory and then you loop over the width/heigh of the image and get the colour components.  Compare the r,g,b values with known values in your image and create the tile element in your tilemap arrays.

//Andy



Ian Price

QuoteOne very simple approach is to use an image to represent your level.  Each pixel represents one tile.  The colour of the pixel indicates the type of tile.
While that can work well you have to be aware that some graphics cards will read the colours slightly differently. You have to be especially careful on mobile devices which may convert your 24bit image into a 16bit one, which again could result in inaccurate map recreation.
I came. I saw. I played.

erico

Quote from: Ian Price on 2013-Mar-05
QuoteOne very simple approach is to use an image to represent your level.  Each pixel represents one tile.  The colour of the pixel indicates the type of tile.
While that can work well you have to be aware that some graphics cards will read the colours slightly differently. You have to be especially careful on mobile devices which may convert your 24bit image into a 16bit one, which again could result in inaccurate map recreation.

I like that approach, done a few things that way in the past.
Do you think if the map file is an 256color image, respecting its bits or 16bit format the miss color thing could be avoided?
Just wondering.

spacefractal

i thinks this thread should been moved to the glbasic en forum?

Anyway I have used the color thing as well in one game, Cave Heroes, created in BlitzMax:


So its is possible, even with the 16 bit issue. howover if the levels is complex, then this is not the recommered way to do it.

In Greedy Mouse, Im did used Tiled as the level editor, because the levels its self was rather very complex.
Genius.Greedy Mouse - Karma Miwa - Spot Race - CatchOut - PowerUp Elevation - The beagle Jam - Cave Heroes 2023 - https://spacefractal.itch.io/

erico

Nice! I´m my case, it was a simple top-down view in black and white.
I used that to calculate collisions.
The thing was actually 3d on its visuals.

Ian Price

I used the colour=tile approach in my Guru Logic Champs game for the puzzles.
I came. I saw. I played.

matchy

Quote from: spacefractal on 2013-Mar-05
So its is possible, even with the 16 bit issue. howover if the levels is complex, then this is not the recommered way to do it.

Agreed and the map needs to end up in an array anyhow, so it takes the same energy to paint it in a map editor with text data than a bitmap paint program.

xxbastianxx

Thanks a lot guys, for all the posts!

I watched a tutorial, where a guy is making a Jump N Run with GL Basic and he uses DDgui which is already in the File Samples of GL Basic.

Has somebody of you made good experience with that ? Can you recommend it ?

spacefractal

personally I have allways do my own implemention, so I have full control what it happens. So I can not answear fo that one. Its depend on the game you want to create and how many features its will have....
Genius.Greedy Mouse - Karma Miwa - Spot Race - CatchOut - PowerUp Elevation - The beagle Jam - Cave Heroes 2023 - https://spacefractal.itch.io/

erico

I think Kitty has the new ddgui going for GACK?, and it looks really amazing!
Here is a video of it in action: