Fade/dissolve when changing UIImageView's image

Josh Kahane picture Josh Kahane · Oct 3, 2011 · Viewed 90.9k times · Source

Rather than creating two UIImageViews, it seems logical to simply change the image of one view. If I do that, is there anyway of having a fade/cross dissolve between the two images rather than an instant switch?

Answer

algal picture algal · Mar 19, 2012

It can be much simpler using the new block-based, UIKit animation methods.

Suppose the following code is in the view controller, and the UIImageView you want to cross-dissolve is a subview of self.view addressable via the property self.imageView Then all you need is:

    UIImage * toImage = [UIImage imageNamed:@"myname.png"];
    [UIView transitionWithView:self.imageView
                      duration:5.0f
                       options:UIViewAnimationOptionTransitionCrossDissolve
                    animations:^{
                      self.imageView.image = toImage;
                    } completion:nil]

Done.

And to do it in Swift, it's like so:

    let toImage = UIImage(named:"myname.png")
    UIView.transitionWithView(self.imageView,
                              duration:5,
                              options: UIViewAnimationOptions.TransitionCrossDissolve,
                              animations: { self.imageView.image = toImage },
                              completion: nil)

Swift 3, 4 & 5

     let toImage = UIImage(named:"myname.png")
     UIView.transition(with: self.imageView,
                       duration: 0.3,
                       options: .transitionCrossDissolve,
                       animations: {
                           self.imageView.image = toImage
                       },
                       completion: nil)