This side tutorial is rather simple, short, and sweet. I am going to show you how to stop using those pesky bitmap (BMP) files that are too big and don’t support alpha transparency, and to start using other file formats for you surfaces (I personally like PNG). If you have not read my SDL Coordinates and Bliting tutorial, I encourage you to do so now. We will be building off of that tutorial, modifying the OnLoad function of the CSurface class.
The first thing you need to do is download SDL_image, the latest version, from the main SDL website. You can also download this library from the “Libraries” section of this website, under SDL. If you don’t want to worry about finding all these libraries, the SDL package I provide is good for most SDL beginners, as it provides SDL_image, and some other useful libraries. Be sure to put the include files in the same directory as your SDL include files, and your lib files in the same directory as your SDL lib files to make things easier.
Start by opening your project, and going under the linker settings. Add SDL_image after SDLmain, something like:
mingw32
SDLmain
SDL_image
SDL
If you don’t remember where to find all these settings, hope on over to the first tutorial SDL Tutorial Basics to get a refresher on linking.
First, open up CSurface.h, so that we can include an extra header file:
#define _CSURFACE_H_
#include <SDL.h>
#include <SDL_image.h>
Once that is all done, open up CSurface.cpp and look for the OnLoad function. Currently, this is what our code looks like:
SDL_Surface* Surf_Temp = NULL;
SDL_Surface* Surf_Return = NULL;
if((Surf_Temp = SDL_LoadBMP(File)) == NULL) {
return NULL;
}
Surf_Return = SDL_DisplayFormat(Surf_Temp);
SDL_FreeSurface(Surf_Temp);
return Surf_Return;
}
There are two changes to make here, the first is changing SDL_LoadBMP to IMG_Load. The second is changing SDL_DisplayFormat to SDL_DisplayFormatAlpha. Remember I said BMPs don’t support alpha layers? Well, PNGs do! And if you are wanting to keep that alpha layer you’ll need to use SDL_DisplayFormatAlpha instead of SDL_DisplayFormat. So, our code should look like this now:
SDL_Surface* Surf_Temp = NULL;
SDL_Surface* Surf_Return = NULL;
if((Surf_Temp = IMG_Load(File)) == NULL) {
return NULL;
}
Surf_Return = SDL_DisplayFormatAlpha(Surf_Temp);
SDL_FreeSurface(Surf_Temp);
return Surf_Return;
}
Finally, don’t forget to change the filename that the Test Surface is trying to load in CApp_OnInit.cpp:
return false;
}
And we are done! I told you it would be short. Try compiling, and trying out different file formats. Some common formats supported by SDL_image are:
BMP (Go figure)
GIF
PNG
JPG
PCX
TIF
and others…
Please note that there are additional DLL files associated with SDL image that are needed now (about 5 of them). So be sure to include those with your project. You can download these DLL files here, http://www.libsdl.org/projects/SDL_image/ under Binary -> Win32 -> and the Win32 zip (not the VC8). Also, the DLL files are also included in the project files below.
This tutorial inspired by Blommis. 
SDL Image – Tutorial Files:
Win32: Zip, Rar
Linux: Tar (Thanks Gaten), Binary (Thanks Thomas)
Did you like this tutorial/blog post? Feel free to donate to keep more comin', and have more contests.
Hello Tim,
First, thanks for the amazing tutorials! Second, i have a problem that i don’t know how to solve. I read the animation tutorial and apply the code, everything went fine. Then i read this SDL image tutorial and tried to apply the changes on the code you did on animation tutorial. When i ran the .exe with this change made here i got the yoshi animation perfect but with no transparency, i mean the pink area in yoshi’s PNG didn’t got transparent. So i changed the “Surf_Return = SDL_DisplayFormatAlpha(Surf_Temp);” back to “SDL_Return = SDL_DisplayFormat(Surf_Temp);” and keeping the yoshi’s PNG on the OnInit.cpp and everthing went fine.
Why DisplayFormatAlpha is not doing what it was suposed to do?
Nevermind, I understood the difference
Thank you; this is exactly the tutorial set I’ve been looking for to start my new project (yet another MMORPG).
I came across a slight issue in effectively getting SDL_Image to work. The program I wrote functioned properly with BMP files (using IMG_Load), but not with PNG files. I found out that the problem was that PNG, TIFF and JPEG images apparently require some additional .dll files in order to work (these are included in Tim’s source code but need to be found in the same directory with the executable).
In my case, PNG images required libpng12-0.dll and zlib1.dll . Once these were placed in my executable’s directory, my program loaded PNGs successfully.
Hello,
I’ve been using your tutorials, and have been able to solve any difficulty so far, except for htis tutorial.
I’ve done the Entities tutorial, and then this one, but now i get 2 warnings and the program crashes on startup.
I can put in all the changes and it works just fine until i replace SDL_LoadBMP with IMG_Load. I’ve tried replacing the old code with new step by step and the Alpha bit works, but IMG_Load doesnt.
I’m using DevC++
can you tell me what im doing wrong please?
Also the two warnings:
39 \SDL oefen\CEntity.cpp [Warning] passing `float’ for converting 3 of `static bool CSurface::OnDraw(SDL_Surface*, SDL_Surface*, int, int, int, int, int, int)’
39 \SDL oefen\CEntity.cpp [Warning] passing `float’ for converting 4 of `static bool CSurface::OnDraw(SDL_Surface*, SDL_Surface*, int, int, int, int, int, int)’
Are you using a valid image file to test with?
Yeah, I used a valid file. I’m running into the same problem again, now while using Code::Blocks as compiler.
‘SDL_IMG_Load’ was not declared in this scope|
IMG_Load, not SDL_IMG_Load. http://www.sdltutorials.com/sdl-image/
Thank you, I must have missed that when editing my code.
seems i have to move around some dll’s but i should be fine now. thanks again for the quick reply
It’s most likely that you forgot to add the required DLL.