[Interest] The "Proper" Way to Mix/Cross-Fade Images

[Jason H]

I wonder if what he wants is a 3-image fade:
layer images 1 and 2 (bottom -> top) as : 121 or 221 then cross fade the top two. The first layer is always 100% opacity.


This should produce an additive-looking fade using multiplication.



----- Original Message -----
From: Bo Thorsen <bo at fioniasoftware.dk>
To: Josiah Bryan <josiahbryan at gmail.com>; Qt Project MailingList <interest at qt-project.org>
Cc: 
Sent: Tuesday, March 20, 2012 11:27 AM
Subject: Re: [Interest] The "Proper" Way to Mix/Cross-Fade Images

Hi Josiah,

You replied to me in person, please keep it on the list.

If they're not the same dimensions, or one of the images is 
semitransparent, then even 50% opacity + 50% opacity = 100% opacity 
wouldn't help you (because one of them would be 50% * x% where
0 <= x < 100). You wanted to avoid looking at the background through 
those two images. That's impossible in these cases, because the begin or 
end product doesn't hold to your assumption during the fade.

However, it's still easy to fix this. Just paint your semi transparent 
image over an opaque image with the background behind.

Pseudocode for this algorithm:

fade(pic1, pic2):
   tempPic1 = background
   draw pic1 on tempPic1

   tempPic2 = background
   draw pic2 on tempPic2
   for x in range(0, 100):
     draw pic1 in window
     draw pic2 with x opacity in window

Now, if your background is semitransparent, you're in trouble. In that 
case, I don't think there is any simple Qt way to do it. Transparency is 
normally done with multiplications, what you want is addition. You might 
be able to do this with the QPainter composition modes, If that works, 
it would also solve the simpler cases.

You could also just go for the retro Sid Meyers favourite "fade" where 
each pixel is replaced one at a time :P

Bo.

Den 20-03-2012 15:03, Josiah Bryan skrev:
> On Tue, Mar 20, 2012 at 9:55 AM, Bo Thorsen <bo at fioniasoftware.dk
> <mailto:bo at fioniasoftware.dk>> wrote:
>
>     Den 20-03-2012 14:17, Josiah Bryan skrev:
>
>         So it all boils down to this:
>         Is there any way to force QPainter (or, heck, just do it on a
>         raw OpenGL
>         surface and skip QPainter/QImage all together) to blend things
>         where 50%
>         opacity + 50% opacity = 100% opacity in the resultant image?
>
>
>     Yes. Paint the first without opacity. Then paint the other with 50%.
>
>
> However, that won't work when trying to smoothly crossfade between two
> images that don't contain purely 100% opaque pixels. Consider a scenario
> where the first image is a full 200x200px image (say, the fadetest-A.png
> from the original email), but the second image is, for example, the
> butterfly from the 'painting/imagecomposition' example in the Qt SDK
> ($QTSDK_HOME/examples/painting/imagecomposition/images/butterfly.png).
>
> In this case, the first image would remain visible behind the un-covered
> areas of the butterfly image, thereby not appearing to "crossfade." (If
> this were rendered with a QTimer and a slot, the butterfly would "fade
> in" over the red letter A (fadetest-A.png), and then suddenly at the
> end, the red letter A image would just disappear - jaring and not the
> desired appearance.
>
> The goal is a smooth cross-faded transition from one image to the other
> - and rendering the first image at 100% opacity would certainly seem to
> ruin the cross-fade effect in every case *except* that where the two
> images to be faded are the exact same dimension and the exact same
> "coverage" in their alpha channels. Other than that, painting the first
> image at 100% opacity doesn't seem like it will work at all...of course,
> I would welcome code that proves me wrong!
>
> Thanks!
> -Josiah
>
>
>     Bo Thorsen,
>     Fionia Software.
>
>     --
>
>     Expert Qt and C++ developer for hire
>     Contact me if you need expert Qt help
>     http://www.fioniasoftware.dk
>
>
>
>
> --
> Josiah Bryan
> 765-215-0511
> josiahbryan at gmail.com <mailto:josiahbryan at gmail.com>


Bo Thorsen,
Fionia Software.

-- 

Expert Qt and C++ developer for hire
Contact me if you need expert Qt help
http://www.fioniasoftware.dk
_______________________________________________
Interest mailing list
Interest at qt-project.org
http://lists.qt-project.org/mailman/listinfo/interest