Ingame Paper doll

[ActionBoy]

Me and my friend have been working on a character system that lets you change the skincolor of your character and haircolor. But what is the best approach?
As the game is really lowres, I was thinking about having a 'hairsprite' and a 'bodysprite' and then later join them so you just render one sprite. But how do I join sprites offscreen pixelperfect. I think this could also be used to create different monster at random.

Here is some screens for the game, called 'The Wastelander':
http://img820.imageshack.us/i/wastelander1.png/
http://img228.imageshack.us/i/wastelander2.png/

[Laurent]

But how do I join sprites offscreen pixelperfect

You can use sf::Image::Copy.

You can also draw them separately, it won't make a huge difference unless you have thousands of characters on screen.

[ActionBoy]

The reason I don't want to draw them separately is that(because of my bad coding) sfml render them slightly of sometimes. I get one pixel off sometimes when I render, zoom and move around. This is because of bad floats and bad zooming(all my fault). I don't know how I missed image::copy. It was in my mind that the image had to be onscreen to copy. Thanks again for some great info and a great lib.

[ActionBoy]

Here is my little function:

Code: [Select]


void loadPaperdoll()
{
    if (!mPaperdoll.mImageBody.LoadFromFile("res//vd//body//1.png"))
    {
        cout<<"Could not read file!!!";
    }
    mPaperdoll.mImageBody.SetSmooth(false);

    if (!mPaperdoll.mImageComplete.LoadFromFile("res//vd//body//1.png"))
    {
        cout<<"Could not read file!!!";
    }
    mPaperdoll.mImageComplete.SetSmooth(false);

    if (!mPaperdoll.mImageClothes.LoadFromFile("res//vd//clothes//1.png"))
    {
        cout<<"Could not read file!!!";
    }
    mPaperdoll.mImageClothes.SetSmooth(false);

    if (!mPaperdoll.mImageHair.LoadFromFile("res//vd//hair//1.png"))
    {
        cout<<"Could not read file!!!";
    }
    mPaperdoll.mImageHair.SetSmooth(false);


    sf::IntRect rct(0,0,0,0);


    mPaperdoll.mImageComplete.Copy(mPaperdoll.mImageClothes,0,0,rct,true);
    mPaperdoll.mImageComplete.Copy(mPaperdoll.mImageHair,0,0,rct,true);

    mPaperdoll.mSprite.SetImage(mPaperdoll.mImageComplete);
    mPaperdoll.mSprite.SetPosition(10,10);
    mPaperdoll.mSprite.SetScale(2.0f,2.0f);
}

The problem is that it don't want to overlay the images.

[Laurent]

You copy both images at the same location in the destination image. The body should be copied at (0, hair.height) instead of (0, 0).

[ActionBoy]

Not sure what you mean? The hair file is the same size as the body file. Everything is 16x16. A little more info:

No pants


Pants


Hair


He gets his pants on, but it wont overlay the hair image. I think it has something to do with it not being "ontop" of the original loaded pixels?

[Laurent]

I see.

You can't see the hair because they are copied to a transparent area of the source image, and Image::Copy doesn't update the alpha of the copied pixels.

So the RGB components of the pixels are properly copied (save the image and open it: you'll see the hair), but the alpha component remains transparent.

I'll see if I can find a "better" algorithm for the alpha component in Image::Copy.

To solve the problem, you can copy the pixels manually without using Image::Copy.

[Laurent]

Hmm... actually, it's already fixed in SFML 2.

[ActionBoy]

You are an expert. Tnx again for the quick reply.

[ActionBoy]

How about using CreateMaskFromColor()? Hmmm...

[Laurent]

No, it can make the mask's pixels transparent, but the others remain the same (ie. their alpha is not restored).