Importing Graphics in SGDK
In part 3 of Adventures in Mega Drive Coding I talked about importing image files into SGDK so you can use them in your game. Since then I’ve received a few questions regarding the matter, as I didn’t do a very detailed job of explaining it. So here’s a more in-depth explanation on how to import graphics (and other things) using SGDK!
The .res file
A project in SGDK has 3 folders by default:
All binary files that you want to import (images, audio…) should be inside the
res folder. But putting the files in this folder is not enough; you have to tell SGDK which of them you actually want to import. In order to do this you will need a
.res file, which will act as a list of resources you want to use in your game.
.res file is essentially just a plain text file but with a different extension. To create it, simply right-click in a folder and select
New > Text Document. Give the file a name, change the extension from
.res and bam, you have your very own
.res file! (Note: On Windows you might have to enable file extensions first.) Make sure to put this file inside your
res folder, along with all the files you want to import.
Once you have your
.res file you have to list the assets that you want to import inside of it. This looks slightly different for each asset type, but here are two examples. If you put the following two lines into your file…
BITMAP block "block.bmp" 0 SPRITE kid_sprite "chameleon.png" 3 4 FAST 1
…it will import two things. First, it will import the file
block.bmp as a
BITMAP file (which is used for tiles).
block is the name we will use to refer to this file from within our code; you can call it anything you want.
The second thing that gets imported is the file
chameleon.png, which will be saved as a
SPRITE resource under the name
kid_sprite (again, feel free to use whatever name you want). Note that both
chameleon.png have to be inside the
res folder next to the
.resfile for this to work.
SGDK supports more resource types than just
SPRITE. You can find a full list here. There you’ll also find info on the parameters for each type.
Once you’ve moved all your files into
res and populated your
.res file with all the resources you want to import, compile the project once. This will compile all the files into a format the Mega Drive can process. It will also generate a C header file in the
res folder with the same name as your
The only thing you have to do with this
.h file is to include it in your project. So at the top of your
main.c file, add this line:
(If you’ve named your resource file something else, you’ll of course have to use that name instead of
This will include the compiled assets in your project and allow you to refer to them using the names you’ve specified in your
.res file. So if I wanted to use our block graphic for example, I could do something like this:
If we had imported it under another name, we would only use that name. So for example, if we had used this line in our
.res file instead…
BITMAP ground "block.bmp" 0
…then we would use the following code to use our block graphic:
The name of the original file does not matter anymore. You simply use the name you have specified in the
So to recap:
- Put the files you want to import into the
resfolder of your project
- Create a
.resfile inside the
resfolder by creating a plain text file, then changing the extension
- Populate the
.resfile with the resources you want to import using the syntax and parameters outlined here
- Compile the project and include the generated header file in
And then you can refer to the compiled resources using the name you specified in the
I hope this clears up a bit of the confusion around importing resources. If you have any more questions feel free to post them below and I’ll try to answer them to the best of my meager abilities!
Join my mailing list!
You'll get notified whenever cool stuff happens!
Take It to the Next Level!Become an excellent patron on Patreon and snatch yourself some kickass perks such as early builds, exclusive updates and more!
Want To Buy Me a Coffee?
Coffee rules, and it keeps me going! I'll take beer too, though.
If you’ve popped over to the tutorial section recently you might have noticed that I’ve added my very first HaxeFlixel tutorial! It shows how to implement a simple, pixel-perfect 2D water shader which I used for Go! Go! PogoGirl. But a few of you might be wondering what a HaxeFlixel is. Well, it’s a 2D game framework that is as powerful as it is underrated! It runs on the (also underrated) Haxe language, is extremely well documented, open source, and has built-in functions for almost anything you’d need.
As I’m sure many of you will remember, the original Streets of Rage for the Mega Drive had multiple endings. The real canonical ending has you beat the crap out of Mr. X, thereby ending his reign of terror forever (yeah, right). However, if you confronted Mr. X with a buddy in tow, a new possible path unlocked. A quick refresher is in order. When you confront Mr. X he will ask you to join his organization.
A few years ago, Yuzo Koshiro posted a pile of old game design documents for Bare Knuckle 2 aka Streets of Rage 2 on the Ancient blog to commemorate the release of Streets of Rage 2 3D on the Nintendo 3DS. These documents gave a deep insight into the game’s inner workings, technical aspects, designs and even some cut content. They were an awesome resource for one of the most awesome games ever created.