This is part of a series of articles that go over the steps I’m taking to learn Flash CS3. The project’s goal is to develop an RPG similar to those published by Square in the mid/late 1990’s. (Secret of Mana, Final Fantasy VI, etc..)
Updated: The tile engine discussed in this post has since been significantly cleaned-up and improved. This tile engine is packaged up with example applications and is available for download here.
So I have my Hero walking around. He’s semi-intelligent and able to test for collisions. But a static screencap of a town isn’t really a compelling environment. Time to focus on creating a world for my Hero to walk around in.
Every 16-bit RPG has some sort of tile engine. This was used to conserve memory while allowing the game to have expansive environments. A tileset was created and these tiles would literally be painted around the world.
A small tileset (courtesy of http://www.lorestrome.com/)
Each of the tiles are 32×32 pixels and each tile can be identified by a reference ID.
tileset2 (courtesy of http://www.lorestrome.com/)
So if you wanted a field of grass, you’d paint with tile ID 0. You can then represent a very large world through an array of these tile IDs. This array would be very small in size and therefore allow for a very large world to be stored in memory.
Milestone: A World to Explore
User Story:I will be able to walk around a believable world that is larger than the Flash movie stage itself.
Acceptance Criteria:
- World data will be loaded from an XML file at runtime.
- The tileset will be loaded from a PNG file at runtime.
- The world must be larger than the Flash movie.
- Only tiles that are within the viewport or buffer will be rendered.
- The viewport will scroll as the player moves ensuring the hero is always visible.
- The hero will not be able to walk through tiles marked as a wall.
- Correct depth indexing will ensure the hero is displayed above or behind tiles appropriately.
Woo… this should be fun!
