biggreentree biggreentree - 1 month ago 30
iOS Question

How to apply an animation effect to UIImageView slideshow

On Swift 3.0 how can I apply some animation effect to this slideshow? Cannot find animation effects related to animationWithDuration method.

let image1 = UIImage(named: "image1")!
let image2 = UIImage(named: "image2")!
let image3 = UIImage(named: "image3")!


var imagesArray : [UIImage] = []



override func viewDidLoad() {
super.viewDidLoad()


imagesArray = [image1, image2, image3]

myView.clipsToBounds = true


myView.animationImages = imagesArray
myView.animationDuration = 10.0
myView.animationRepeatCount = 0
myView.startAnimating()

}

Answer

It looks like you are using the build in frame animation for UIImageView. This is designed to just cycle through the images, like an animated gif. It doesn't really have more sophisticated animation than that. What you can do if you want transition effects is alternate between two image views and use the UIView Animation methods to switch between them. This just does a crossfade by manipulating alpha:

    var images = [UIImage]()
    var currentImageindex = 0
    func animateImageViews() {
        swap(&firstImageView, &secondImageView)
        secondImageView.image = images[currentImageindex]
        currentImageindex = (currentImageindex + 1) % images.count
        UIView.animate(withDuration: 1, animations: {
            self.firstImageView.alpha = 0
            self.secondImageView.alpha = 1
            }, completion: { _ in
            self.animateImageViews()
        })
    }

Here is playground that shows how it works. You need to drop 2 images into the resources folder named 1.png and 2.png for it to work. Note that setting the view frames like this is horrible programming practice i just did it here for brevity. use interface builder and autolayout in your actual code.

    import PlaygroundSupport
    import UIKit

    class Demo: UIViewController {
        let button = UIButton()


        var firstImageView = UIImageView()
        var secondImageView = UIImageView()
        var images = [UIImage]()
        var currentImageindex = 0
        override func viewDidLoad() {
            view.addSubview(firstImageView)
            view.addSubview(secondImageView)
            images.append(UIImage(named: "1.png")!)
            images.append(UIImage(named: "2.png")!)
            firstImageView.image = images[0]
            secondImageView.image = images[1]
        }

        override func viewDidLayoutSubviews() {
            super.viewDidLayoutSubviews()
            firstImageView.frame = view.frame
            secondImageView.frame = view.frame
        }

        override func viewDidAppear(_ animated: Bool) {
            animateImageViews()
        }

        func animateImageViews() {
            swap(&firstImageView, &secondImageView)
            secondImageView.image = images[currentImageindex]
            currentImageindex = (currentImageindex + 1) % images.count
            UIView.animate(withDuration: 1, animations: {
                self.firstImageView.alpha = 0
                self.secondImageView.alpha = 1
                }, completion: { _ in
                self.animateImageViews()
            })
        }
    }
    let viewcontroller = Demo()
    viewcontroller.view.frame = CGRect(x: 0, y: 0, width: 100, height: 100)
    PlaygroundPage.current.liveView = viewcontroller.view