Sep 27, 2019 Tiled, tIDE (Tilemap Integrated Development Environment), and Mappy are probably your best bets out of the 6 options considered. 'Cross-platform' is the primary reason people pick Tiled over the competition. This page is powered by a knowledgeable community that.
Tile-Based Games. In the tile-based approach, each visual element is broken down into smaller pieces, called tiles, of a standard size. These tiles will be arranged to form the game world according to pre-determined level data - usually a 2D array. The game engine you waited for. Godot provides a huge set of common tools, so you can just focus on making your game without reinventing the wheel. Godot is completely free and open-source under the very permissive MIT license. No strings attached, no royalties, nothing. Your game is yours, down to the last line of engine code.
![2d Game Tile Maker 2d Game Tile Maker](/uploads/1/2/6/3/126376219/970074896.jpg)
Part of a series on: |
Video game graphics |
---|
|
An oblique texture atlas in the style of Ultima VI
A tile-based video game is a type of video or video game where the playing area consists of small square (or, much less often, rectangular, parallelogram, or hexagonal) graphic images referred to as tiles laid out in a grid. That the screen is made of such tiles is a technical distinction, and may not be obvious to people playing the game. The complete set of tiles available for use in a playing area is called a tileset. Tile-based games usually simulate a top-down, side view, or 2.5D view of the playing area, and are almost always two-dimensional.
Much video game hardware from the late 1970s through the mid 1990s had native support for displaying tiled screens with little interaction from the CPU.
Overview[edit]
Tile-based games are not a distinct video game genre; rather, the term refers to the technology a game engine uses for its visual representation. For example, Ultima III is a role-playing video game and Civilization is a turn-based strategy game, but both use tile-based graphic engines. Tile-based engines allow developers to create large, complex gameworlds efficiently and with relatively few art assets.
Tile-based video games usually use a texture atlas for performance reasons. They also store metadata about the tiles, such as collision, damage, and entities, either with a 2-dimensional array mapping the tiles, or a second texture atlas mirroring the visual one but coding metadata by colour. This approach allows for simple, visual map data, letting level designers create entire worlds with a tile reference sheet and perhaps a text editor, a paint program, or a simple level editor (many older games included the editor in the game). Examples of tile-based game engine/IDEs include RPG Maker, Game Maker, Construct, Godot, and Tiled.
Variations include level data using 'material tiles' that are procedurally transformed into the final tile graphics, and groupings of tiles as larger-scale 'supertiles' or 'chunks,' allowing large tiled worlds to be constructed under heavy memory constraints. Ultima 7 uses a 'tile,' 'chunk' and 'superchunk' three-layer system to construct an enormous, detailed world within the PCs of the early 1990s.
History[edit]
The tile-map model was introduced to video games by Namco's arcade gameGalaxian (1979), which ran on the Namco Galaxianarcade system board, capable of displaying multiple colors per tile as well as scrolling. It used a tile size of 8×8 pixels, which since became the most common tile size used in video games. A tilemap consisting of 8×8 tiles required 64 times less memory and processing time than a non-tiled framebuffer, which allowed Galaxian's tile-map system to display more sophisticated graphics, and with better performance, than the more intensive framebuffer system previously used by Space Invaders (1978).[1]Video game consoles such as the Intellivision, released in 1979, were designed to use tile-based graphics, since their games had to fit into video game cartridges as small as 4K in size, and all games on the platform were tile-based.
Home computers had hardware tile support in the form of ASCII characters arranged in a grid, usually for the purposes of displaying text, but games could be written using letters and punctuation as game elements. The Atari 400/800 home computers, released in 1979, allow the standard character set to be replaced by a custom one.[2][3] The new characters don't have to be glyphs, but the walls of a maze or ladders or any game graphics that fit in an 8x8 pixel square. The video coprocessor provides different modes for displaying character grids. In most modes, individual monochrome characters can be displayed in one of four colors; others allow characters to be constructed of 2-bit (4 color) pixels instead. Atari used the term redefined characters and not tiles.
The tile model became widely used in specific game genres such as platformers and role-playing video games, and reached its peak during the 8-bit and 16-bit eras of consoles, with games such as Mega Man (NES), The Legend of Zelda: A Link to the Past (SNES) and Shining Force (Mega Drive) being prime examples of tile-based games, producing a highly recognizable look and feel.
2d Game Tile Maker Download
Blades of Exile features multi-character combat on a tiled overhead map
Most early tile-based games used a top-down perspective.[citation needed] The top-down perspective evolved to a simulated 45-degree angle, seen in 1994's Final Fantasy VI, allowing the player to see both the top and one side of objects, to give more sense of depth; this style dominated 8-bit and 16-bitconsole role-playing games.[citation needed]Ultimate Play the Game developed a series of video games in the 1980s that employed a tile-based isometric perspective. As computers advanced, isometric and dimetric perspectives began to predominate in tile-based games, using parallelogram-shaped tiles instead of square tiles. Notable titles include:
- Ultima Online, which mixed elements of 3D (the ground, which is a tile-based height map) and 2D (objects) tiles
- Civilization II, which updated Civilization's top-down perspective to a dimetric perspective
- The Avernum series, which remade the top-down role-playing series Exile with an isometric engine.
Hexagonal tile-based games have been limited for the most part to the strategy and wargaming genres. Notable examples include the Sega Genesis game Master of Monsters, SSI's Five Star series of wargames, the Age of Wonders series and Battle for Wesnoth.
See also[edit]
References[edit]
- ^Mark J. P. Wolf (15 June 2012). Before the Crash: Early Video Game History. Wayne State University Press. p. 173. Retrieved 8 July 2016.
- ^'De Re Atari'. atariarchives.org. Atari, Inc. 1982.
- ^Patchett, Craig (1982). Designing Your Own Character Sets. COMPUTE! Books.
Retrieved from 'https://en.wikipedia.org/w/index.php?title=Tile-based_video_game&oldid=919196164'
8 Oct 2009CPOL
Introduction
This is a simple 2D map editor that shows how you can create and manage 2D tiled maps for games or other purposes. While some of the methods used to store and manage the data in the editor may not be directly applicable to a game, where memory management is very important, it does give an easy to understand and flexible starting point.
Background
A very long time ago, I made a quick n' dirty map editor for a project. I then completely rewrote the editor to post here. We are now on the third iteration of the editor. While it is very similar to the previous version, there are some great advancements.
Classes
The Editor is split into two projects; the
MapEditor
WinForm which houses all of the controls and MapEditorLib
which provides most of the functionality. I'll go through the classes in the MapEditorLib
first.Tile
The
Tile
class is the most basic class we need to create our map. It holds a reference to a Tileset
which is, in its most simple form, just the image or texture that the tile is using. SourceX
and SourceY
are the pixel coordinates in the tileset that this tile starts at. XPos
and YPos
represent the actual location in the map of this tile. Each tile also has another property which we can use to determine if a tile is solid or not; any number of other properties could be added to the tile class like this, for example you could have a property stating that the tile is water, or should only be drawn every second Tuesday. The choice is yours.MapLayer
The next step up is the
MapLayer
which is basically the whole map, or at least one layer of it. The main part of this class is the 2D array of Tile
, which represents the map itself. The second most important part is Z_Value
which is used to sort the different layers of the map so that they can be drawn in the correct order. The Name
and ID
properties are used to identify a layer in the editor. While a layer's name doesn't have to be unique, its ID does. Each element in the array is only initialized when a tile is actually placed there, which is why we have the
TileIsAlive
function, which can tell us if a tile is there and should be dealt with.Map
Here we are, the
Map
class, this one is fairly important. This one uses a List<MapLayer>
to store the layers of the map, and adds a little more information that we need to fully describe the map. So we have a few more properties for the width and height of the map, Width
and Height
are the size in tiles of the map, RealWidth
and RealHeight
are the size in pixels of the map calculated by using the current tilesize. TileSize
is the size in pixels of each tile. The
Map
class also has functions for loading a map from file or from a stream. The map data that is saved to file only includes the name and ID of the Tileset
, so we need a way to get the image data. Depending if we are in a game or in the Editor, the image data could be in the memory or on disk somewhere. In the case of the Editor, the images are saved in a folder with the map data. We use the delegate RequestTexture
to get the image data from whatever application is using the Map
class. The application should be able to get us the data we need via its name.EditableMap
This is the class that is used by the WinForms half of the application, it contains a plethora of functions to query and update the map. A very important property in here is
WorkingLayer
; this is the layer in the map that is currently selected and the one to which any changes will be applied. Most of the functions here are pretty self explanatory, so I shouldn't need to go through them all. I will however mention SetSelectedTiles
; this function takes a 2D array of Tile
that are the currently selected tiles from the Tileselect
control (which I'll cover later). These are the tiles that will be placed on the map wherever the user clicks. We also have the Save
functions and the extra SaveTextures
function which saves the images stored in each of the Tileset
s to disk. Like I said earlier images are not stored in the map itself because they may already be loaded into memory or stored in an archive for a game, etc. 2d Game Tile Maker
The
OnMapChanged
event is fired whenever the map is updated, the main form registers for this event so that it knows when the map needs to be redrawn. I decided to make an event for this so that all calls to redraw the map would come from one place. It's worth mentioning that there is no code in the MapEditorLib
to render the map. It is currently held in the MapEditor
WinForms project.Tileset
The last class in the
MapEditorLib
whose main job is to store an image, as well as a name and a unique id as you can see. What I also assume you have noticed is that it stores an IntPtr
and a Texture2D
; these are not set by default but are actually set by one of the two rendering options I've made available; GDI and XNA. Depending on the renderer chosen, the appropriate values are setup and disposed of by the rendering routine; the Image
property is always set up.There are only a couple of classes from the WinForms project that I need mention, the map renderers. In the
MapEditor
project, there is a control MapPanel
which is an empty user control which overrides the regular paint methods and calls a delegate that can be assigned to different external functions. By doing this, we are able to change the methods used to render the map in one simple line, of course we need to set up the render first, which brings us to the map renderers interface.IMapRenderer
This is the
interface
for any renderers that you want to add. The two key functions here are ResetGraphicsDevice
and RenderMap
. The first is called when the form or the map is resized and any buffers may need to be changed to accommodate the new dimensions. The second is called from the overridden OnPaint
in the MapPanel
control via the delegate that I mentioned earlier.When initially starting the Editor, I simply used GDI+ but as you may know, this is ridiculously slow. I mean it, it was quicker for me to lock the bits in a bitmap, copy the data out and edit it, then copy it back in and unlock the bits and do a
BitBlt
than it was to use GDI+ and that is no exaggeration. I actually wrote a method to do that so I could have per pixel alpha blending done in GDI. I then moved on to using PInvoke and the GDI function BitBlt
to render the tiles, which was much quicker. GDI though cannot handle alpha channels, and even though I wrote a function to get around this, it was still too impractical, so I looked into using DirectX and using the Graphics hardware to help render the map with alpha blending. It turns out you are able to pass any window handle to XNA to create a drawing surface, that includes the handles of Windows controls. So I now have two renderers that implement the IMapRenderer
interface, one that uses GDI and GDI+ and another that uses hardware accelerated 3D rendering through XNA.I can only recommend using the
XnaMapRenderer
as it eliminates flickering, is much quicker, provides you with alpha blending and is much more representative of what the map will be like in an actual game. However, if for some reason you like to suffer and have your eyes bleed at the lack of smooth edges and large magenta blocks, then feel free to make use of the GdiMapRenderer
.How It All Fits Together
On the main form, there are only a couple of controls, the
TiledMap
and the TileSelect
; the latter is a fairly simple control that allows you to load an image and then draws a grid over it. You are then able to pick tiles off of the grid. When you select some tiles in the TileSelect
control, an event is sent to the main form, which then passes this information over to the TiledMap
control. The rest of the user input is handled in the TiledMap
control, which is setup to receive the mouse and size changed events, as well as watching for a few key presses. There is also an options dialog that the main form is in control of. When you use this dialog the main form receives an event and passes the data on to the TiledMap
which then makes the necessary changes. The TiledMap
also makes use of either GdiMapRenderer
or XnaMapRenderer
to render the map, no actual drawing code is present on the control.You will find that most of the actual work for the map editor is done between the
EditableMap
and one of the two renderers.Using the Code
Once you've made the map and saved it, if you want to use it in some game or other application, simply reference the
MapEditorLib
and use the Map
class to load up your map. If you want to make your own map editor using this library, then once again simply reference the DLL and make use of the EditableMap
As in older versions of the Editor, the map data is saved out to file sequentially, there are no extra values or descriptions you need to look at when loading the file, so making a loader for a C++ application should be fairly simple.
For your convenience, here is some pseudo code for how the map is written out, so you can understand how to read the file format:
History
- 18th May, 2008 - Article posted
- 7th October, 2009 - Major update to the Editor