[stayscrisp]

This tutorial will cover a basic way of creating PNG files with an alpha channel for transparency. These can be loaded into SDL_Image for transparency without colour keying. We will use photoshop for this.

PNG with transparency

I have attached a file for us to use, so download it and open it in photoshop, as you can see the background is all one colour, this is quite important to get this method to work correctly.

Most sprite sheets found online will have one colour as a background so it shouldn't be a problem.




For this we will use the Magic Wand Tool

Select this tool then click on the background of the image, depending on where you clicked it should select the outline of the character plus the outline of the image itself. If it does not click somewhere else on the green background until it has selected.




Once you have the outline of the image and character selected click the select drop down menu or click CTRL+SHIFT+I to inverse the selection



Now copy the selected character by choosing copy from the drop down edit menu or pressing CTRL+C then paste the image using the drop down edit menu or pressing CTRL+V.

It will paste into a new layer, now select your background layer in the layers list, right click and delete this layer.



You now have a PNG with a transparency, simply choose save as and PNG file. Now when you load this image using SDL_Image it will automatically have transparency and wont have that awful colour keyed look

Hope this helps, to get started with SDL check out my tutorials in the Game Programming Tutorials section of D.I.C.

Any questions or comments welcome.

[TripYR]

I have a suggestion.
Maybe you could have provided the PNG photo, so viewers could see the finished product.
I love this tutorial, it's quick and simple.

This post has been edited by TripYR: 08 March 2011 - 11:03 PM

[aaron1178]

Great tutorial stayscrisp, to bad I only just found it

[KloqKlap]

gj