Overlapped transparency.

By jlnr (dev) Date 2012-06-11 06:41

You don't need shaders, but a way to create a single image from your stack of images. I think Texplay can do this, but I'm not sure. ImageMagick can do it too. Once you have merged them into a single image, you can draw it as you wish.

Or you could somehow fake it by making the skin in the eye pieces semi transparent and drawing them after the body etc… but I'm not sure if that's feasible.

I'd really love to have real render-to-texture in Gosu actually, but I'm busy these months :( Contributions welcome!

By danikaze Date 2012-06-11 11:35

But as the eyes and mouth are constantly changing, is it a good idea to merge it into a single image and then draw it? Isn't it a bitexpensive to generate images all the time?

By jlnr (dev) Date 2012-06-11 12:32

Good call. Are they the same size all the time? Can you just cut out the areas in the "background" person?

By danikaze Date 2012-06-11 12:35

I already thought about that, but I can't guarantee that... :-S
That's why I need the shader-like image drawing

By jlnr (dev) Date 2012-06-11 13:18

Hmm, that would be a question for an OpenGL board then...

Another quick hack idea (because all games need these :D), draw the background, draw the fading character, draw the background again at 50% opacity, draw normal characters?

By danikaze Date 2012-06-11 14:22

yep that's another hack, but anyways I want to do it in a right way, so I'll try to investigate something on OpenGL... hope it's not too much complicated :P

By RavensKrag Date 2012-06-17 22:24

Why don't you do the opposite? Take the color away from the "layers" of the eyes and mouth. Thus, the eyes and mouth would be on transparent backgrounds. Currently, it looks like the eyes/mouth are on skin-colored backgrounds.

By jlnr (dev) Date 2012-06-18 00:24

Since this topic came up just hours before:

http://www.libgosu.org/cgi-bin/mwf/topic_show.pl?tid=774

If you remove the backgrund color, be super careful that you can really deeply remove it :)

danikaze's images are likely neither stretched nor rotated, but with things like auto-stretching to fullscreen (Linux Gosu), it could still happen.

By Spooner Date 2012-06-11 23:34

You can use TexPlay's Gosu::Window#render_to_image to create a single image from the individual sprites and then make it transparent. Unfortunately, render_to_image's method of hack means the final image won't have transparency, but you can fill the background with a colour (say, purple) that you will clear to transparent later. render_to_image is fast, in case you want to do it a lot, but a cleaner, if slower, way is TexPlay's Image#splice.

By Maverick Date 2012-06-12 16:48

Correct me if I'm wrong, but if the problem here is that the opacity is adding up because it's over another transparent image, then won't increasing the level of transparency (therefore reducing opacity aka alpha) make the resulting image look like the op wants it to?

Edit: looked at the images closer. I'm not sure how Gosu is handling the alpha properties of the images, but something's not making sense to me. In the left photo everything is overlapped nicely and the black pixels are defined. In the second, there's obvious lightening of the overlapped graphics, but even the black pixels are very "watered-down". Why is this?

By danikaze Date 2012-06-13 11:57

The images are fake. It was made by me on Photoshop just to illustrate the problem. The black pixels in the 2nd image shouldn't be lightened. Sorry.

By Maverick Date 2012-06-13 15:42

Would you mind rendering your graphics via Gosu and take a screenshot? I'd like to see what's going on. :)

By jlnr (dev) Date 2012-06-14 03:36

It's a common problem actually. Let's imagine the face and the background of the eye images as a solid yellow (ffff00). We'll draw on a black background. The face is drawn with 50% alpha, ends up being 7f7f00. Now we draw the eyes with 50% alpha. The yellow background of the eyes is mixed with 7f7f00 (face already drawn), resulting in afaf00. So the rectangles around the eyes are a brighter yellow than the face.

Terava uses skeletal models and I cannot draw transparent characters for the same reason. The joints would appear less transparent than the actual limbs, because that's where two images overlap.

By Maverick Date 2012-06-14 15:51

Oh! I see now.

By Omegas7 Date 2012-08-04 22:24

I think you can do this using window#record. Basically you render all your body parts into one single Gosu::Image object. So when you change the opacity, it will all change as one single entity.

By jlnr (dev) Date 2012-08-05 07:57

Nope - Images recorded using Window#record can only be drawn with full transparency. :(

By Omegas7 Date 2012-08-05 19:13

Oh, why is that? I though that it returned a Gosu::Image (and I remember changing the opacity of Gosu::Image objects)

By jlnr (dev) Date 2012-08-05 23:08

It's a detail of how record works. It does not render to a texture, it does really "record" your drawing. If you would record the body parts and draw them with 50% opacity, it'd look exactly as if you drew each part on top of each other without using record. So I haven't even implemented drawing with changed opacity. (And if I did, it would never change the OP's problem.)