Silverlight + Gyromite = Tile Engine?

A Night of Boredom…

I was reading about Silverlight 3 and its lovely new WriteableBitmap the other day and thought, “I wish i could think of something cool to test that with”. The very next day I found myself playing Gyromite on the NES, and remembering how awesome that game was.

After playing for a while, mostly enjoying the music, I decided that making a web version of Gyromite would be the perfect way for me to try out the WriteableBitmap stuff, as well as generally improving my Silverlight skills. So as if by magic, Silvermite was born!

The Engine So Far

A fair amount of progress has been made so far. I have made a resource manager which loads in all of the resources (big surprise) and caches them, created definition formats for tile sets, maps and sprites, I have decided to go for XML for all of my data formats, mainly because it is quick and easy to create the classes needed to validate/load these files using schemas (more on this in a tutorial later). Of course I have also used WriteableBitmap to display all of this on the screen.

Graphics

I spent several hours pulling the graphics out of the game, tweaking their colours and arranging them into their proper animation sets. I won’t go into the full details of this process, but it involved an emulator and Photoshop. I also won’t get into the legality of emulation here, I own a copy of this game on the NES and I am using the graphics/concept for educational purposes only. Please don’t ask me how/where to get a rom for this game (the answer is eBay).

Resource Manager

Any images loaded using the resource manager are cached to avoid repeated loading. Resources such as sprites and maps are loaded and cached using a resource naming system, for example asking it to load “mainSprites>player” would first check if that has been loaded already, and if not it would load the entire “mainSprites” sheet into the cache before returning the requested sprite.

Tile set Definitions

The tile sets are the simplest structures, consisting of an input image and a set of named and numbers source rectangles. I might possibly add “brushes” into the tile set definitions, allowing me to put whole blocks of tiles into maps in one call, as with the bar supports in Silvermite.

Map Definitions

These get slightly more interesting. First, I have added support for multiple layers (and potentially parallax in the future?). Within each of these layers, tiles are defined either individually or in whole runs. This allows me to define an entire platform almost as easily as a single block. Currently only the static maps are supported, but game objects such as enemies, turnips, player starts and bars will eventually be defined in here. The tiles are loaded in from a tile set specified in the map.

Sprite Definitions

Easily the most complex data format so far. The static sprites are pretty much the same as tile definitions, just a name and a source rectangle. The animated sprites have multiple animations defined.

An animation can be of 4 different types : static, once, loop and ping-pong. “Static” is useful for things such as standing and jumping poses, “loop” is fairly self explanatory, “once” plays through once and can define a new animation to move into afterwards, “ping-pong” reverses direction when it gets to the end and continues to loop backwards and forwards. Each animation has a name and a frame rate defined, allowing different animations of a single sprite to play at different speeds.

Another planned feature is “stretch sprites”, mostly for the bars. These will allow me to define a top, bottom and middle section and stretch the middle section to make the sprite any height I need.

The Tutorials

I am going to try to write a series of tutorials covering all these subjects as I progress with the engine, aiming to release one a week for the next few weeks. The first tutorial will be about very basic game loop set up and drawing using WriteableBitmap, probably followed by the tile/map definitions. All other tutorials will come as the code gets finished or in the order requested if enough people show interest.

So, expect the first tutorial some time this week if everything goes to plan. I won’t post the entire code yet because it is currently in a pretty poor state in places, but if anybody is really desperate to see some specific part of the code for some reason, let me know and I should be able to sort it out for you.

I’ll end with a stress test screenshot showing 140 animated player sprites walking about.

That's a lot of players