RPGSS: Basic of Tilemap, Tileset and Map

RPG Maker (RGSS)

RPGSS: Basic of Tilemap, Tileset and Map

In this lesson we'll learn the basic of loading a map, loading tilesets, and displaying a tilemap on the screen.

TILESETS

RGSS has a data structure called Tileset. I find the term a bit misleading because in truth the structure holds more than only one tileset. There are in fact 9 slots referring to a tileset type as follow: A1, A2, A3, A4, A5, B, C, D, E. The RPG Maker team should have called this class something like Tilesets or TilesetPack to strengthen the idea it’s a group of tilesets, not just one.

When you organize tilesets within the RPG Maker’s tileset editor, each ‘pack’ of tilesets are stored in an array, and this array is then saved as “Tilesets.Rvdata2” within the Data folder.

What’s more, each map in RPG Maker is associated to one of those packs of tilesets stored in “Tilesets.Rvdata2”. A map has in fact a property called tileset_id which refer to an index of that array.

Here’s a quick demo that allows to display each image from a pack of tilesets associated to a map on the screen.

1-) Open RPG Maker VX and open the Script Editor. Hotkey is F11.
2-) Delete every file-based section of code. Absolutely everything. Hotkey is Del for each entry.
3-) Create a new file. Hotkey is Ins in the file-like explorer section.
4-) Enter the following code in the editor.

map_id = 1
@map = load_data(sprintf("Data/Map%03d.rvdata2", map_id))

@tilesets_rvdata = load_data("Data/Tilesets.rvdata2")
@ts_pack = @tilesets_rvdata[@map.tileset_id]

@ts_images = []

@ts_pack.tileset_names.each do |str|
@ts_images.push( Bitmap.new("Graphics/Tilesets/" + str) ) if str != ""
end

@show_tileset = Sprite.new

i = 0

loop do
Graphics.update

Input.update

if Input.trigger?(:LEFT)
i -= 1 if i > 0
elsif Input.trigger?(:RIGHT)
i += 1 if i < @ts_images.length-1
end

@show_tileset.bitmap = @ts_images[i]

end

You can cycle throughout the list of tilesets using the Left and Right arrows.

First, we load our packs of tilesets in a variable that serves as an array: @tilesets_rvdata = load_data(“Data/Tilesets.rvdata2”). Then, we find the tileset pack we need with our map’s tileset id property: @tileset = @tilesets_rvdata[@map.tileset_id]. The Tileset data structure doesn’t hold an array of images per se, it holds only the filenames in an array. So we create an array of bitmaps in which we use those filenames as the main parameter: @ts_pack.tileset_names.each do |str| @ts_images.push( Bitmap.new(“Graphics/Tilesets/” + str) ) if str != “” end.

In summary, remember that a map hold a tileset_id that refers to the index of the ’tilesets.rvdata2′ array. Each pack of tilesets has an array of ‘filenames’ that refer to image files in the folder. You use those filename to create bitmap objects in the code. There’s more related to the Tileset data structure, such as tile collision, but it will be for another future lesson.

TILEMAP

RPG Maker has a built-in feature called Tilemap. This feature magically takes care of the rendering process of tiles assigned to it. Coding your own rendering engine would take a significant amount of efforts. It’s something I plan to teach, if there’s enough requests in the future. For the time being, the Tilemap class provided by the RPG Maker team does the trick with very little intervention from the coder—even if it’s somewhat limited for complex mapping layouts. Here’s the simplest way to init the Tilemap class:

1-) Open RPG Maker VX and open the Script Editor. Hotkey is F11.
2-) Delete every file-based section of code. Absolutely everything. Hotkey is Del for each entry.
3-) Create a new file. Hotkey is Ins in the file-like explorer section.
4-) Enter the following code in the editor.

@map = load_data("Data/Map001.rvdata2")

@tilemap = Tilemap.new
@tilemap.map_data = @map.data

In the following demo, the map’s tileset image will switch at x interval of time, while preserving the tilemap data.

### SETTINGS

screen_width = 640
screen_height = 480
Graphics.resize_screen(screen_width, screen_height)

### LOAD EXISTING MAP

map_id = 1
@map = load_data(sprintf("Data/Map%03d.rvdata2", map_id))

### CREATE TILEMAP

@viewport = Viewport.new(0,0,screen_width, screen_height)
@tilemap = Tilemap.new(@viewport)
@tilemap.map_data = @map.data

### LOAD EXISTING TILESETS

path = "Graphics/Tilesets/"

tileset_arr = []
tileset_arr[0] = "Outside_A1"
tileset_arr[1] = "Inside_A1"
tileset_arr[2] = "World_A1"

### MAIN LOOP

i = 0

loop do
@tilemap.bitmaps[0] = Bitmap.new(path + tileset_arr[i])

i += 1
i = 0 if i > 2

Graphics.update
Graphics.wait(30)
end

So, that’s the basic of it. Of course, there’s more to learn, but that will be for another lesson. Stay tuned.

Leave a Reply

Your email address will not be published. Required fields are marked *