Question

How can I have that functionality in my game through which the players can change their hairstyle, look, style of clothes, etc., and so whenever they wear a different item of clothing their avatar is updated with it.

Should I:

• Have my designer create all possible combinations of armor, hairstyles, and faces as sprites (this could be a lot of work).

• When the player chooses what they should look like during their introduction to the game, my code would automatically create this sprite, and all possible combinations of headgear/armor with that sprite. Then each time they select some different armor, the sprite for that armor/look combination is loaded.

• Is it possible to have a character’s sprite divided into components, like face, shirt, jeans, shoes, and have the pixel dimensions of each of these. Then whenever the player changes his helmet, for example, we use the pixel dimensions to put the helmet image in place of where its face image would normally be. (I’m using Java to build this game)

• Is this not possible in 2D and I should use 3D for this?

• Any other method?

Please advise.

Answer 1

3D will not be necessary for this, but the painter algorithm that is common in the 3D world might IMHO save you some work:

The painter algorithm works by drawing the most distant objects first, then overdrawing with objects closer to the camera. In your case, it would boild down to generating the buffer for your sprite, drawing it onto the buffer, finding the next dependant sprite-part (i.e. armour or whatnot), drawing that, finding the next dependant sprite-part (i.e. a special sign that’s on the armour), and so on. When there are no more dependant parts, you paint the full generated sprite on to the display the user sees.

The combinated parts should have an alpha channel (RGBA instead of RGB) so that you will only combine parts that have an alpha value set to a value of your choice. If you cannot do that for whatever reason, just stick with one RGB combination that you will treat as transparent.

Using 3D might make combining the parts easier for you, and you’d not even have to use an offscreen buffer or write the pixel combinating code. The flip-side is that you need to learn a little 3D if you don’t know it already. 🙂

Edit to answer comment:

The combination part would work somewhat like this (in C++, Java will be pretty similar – please note that I did not run the code below through a compiler):

//  // @param dependant_textures is a vector of textures where  // texture n+1 depends on texture n.  // @param combimed_tex is the output of all textures combined void Sprite::combineTextures (vector<Texture> const& dependant_textures,                                Texture& combined_tex) {    vector< Texture >::iterator iter = dependant_textures.begin();    combined_tex = *iter;     if (dependant_textures.size() > 1)      for (iter++; iter != dependant_textures.end(); iter++) {         Texture& current_tex = *iter;          // Go through each pixel, painting:         for (unsigned char pixel_index = 0;               pixel_index < current_tex.numPixels(); pixel_index++) {            // Assuming that Texture had a method to export the raw pixel data            // as an array of chars - to illustrate, check Alpha value:            int const BYTESPERPIXEL = 4; // RGBA            if (!current_tex.getRawData()[pixel_index * BYTESPERPIXEL + 3])                for (int copied_bytes = 0; copied_bytes < 3; copied_bytes++)               {                 int index = pixel_index * BYTESPERPIXEL + copied_bytes;                 combined_tex.getRawData()[index] =                     current_tex.getRawData()[index];               }                        }      } } 

To answer your question for a 3D solution, you would simply draw rectangles with their respective textures (that would have an alpha channel) over each other. You would set the system up to display in an orthogonal mode (for OpenGL: gluOrtho2D()).