Question

There are a lot of posts about crossfade of UIImages using an animation. But I can't find how to control the crossfade without animation, but instead by myself; for example with a parameter between 0.0 and 1.0 that controls the amount of crossfade.

I could put two UIImageViews behind each other and control the alpha (top one going from 1.0 to 0.0, and the bottom one at 1.0), but that's not a proper crossfade AFAIK.

To make it more graphic: On screen there's a slider that gives a value between 0.0 and 1.0, above it is an image. What I want is to crossfade between the initially shown image (when slider is 0.0) and another image (which if fully visible when slider is 1.0). So, when you'd slowly move the slider, you'd see the other image slowly appear.

Was it helpful?

Solution 2

If you use two UIImageViews with clear backgrounds and vary the alpha channels from 0-1, 1-0, you should get very close to the effect you're looking for. I've found it works better if there's a black background behind both of them. It's perhaps not a true crossfade, but comes close enough for most usages.

OTHER TIPS

You can use the image view alpha approach. How correct this is depends on the effect you're looking for. Using a value between 0 and 1 makes this approach relatively simple and is the obvious choice.

You could also look at rendering both images into a context and using CGContextSetBlendMode, possibly with kCGBlendModeMultiply, to combine the images. No parameters are available with this so you would still need to change the alpha of the rendering to get an acceptable merge / fade.

To achieve that I used CATransition animations:
This a snippet from an old code

CATransition *fadeTransition = [CATransition animation];
fadeTransition.duration = 1.0f;
fadeTransition.type = kCATransitionFade;
fadeTransition.endProgress = 0.75;
[imageView setImage:/*YourImage*/];
[imageView.layer addAnimation:fadeTransition forKey:nil];

With -endProgress property you can set the end before it completes, but I have not a clear idea of what you want to achieve.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top