Question

我正在尝试通过使用UIImageView并通过动画化过渡效果来平滑地在两个图像之间进行过渡，但是似乎过渡效果没有达到预期效果，因为出现了白屏，而不是新的图像淡入了。

我已使用https://stackoverflow.com/a/42710002/7908770作为参考，却无法弄清楚哪里出了问题：（

class ViewController: UIViewController {

    var bckgImageView = UIImageView(image: UIImage(named: "one"))

    override func viewDidLoad() {
        super.viewDidLoad()

        bckgImageView.frame = self.view.frame
        self.view.addSubview(bckgImageView)

        animateBackground()

    }

    func animateBackground() {

        UIView.transition(with: self.view,
                          duration: 5,
                          options: .transitionCrossDissolve,
                          animations: { self.bckgImageView.image = UIImage(named: "two") },
                          completion: nil)

    }

Answer 1

在viewDidLoad中尚未计算自动布局

您可以在viewDidLayoutSubviews中更改布局时设置框架。试试这个

class ViewController: UIViewController {

    var bckgImageView = UIImageView(image: UIImage(named: "one"))

    override func viewDidLoad() {
        super.viewDidLoad()

        bckgImageView.frame = self.view.frame
        self.view.addSubview(bckgImageView)

        animateBackground()

    }

    func animateBackground() {

        UIView.transition(with: self.view,
                          duration: 5,
                          options: .transitionCrossDissolve,
                          animations: { self.bckgImageView.image = UIImage(named: "two") },
                          completion: nil)

    }

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        bckgImageView.frame = self.view.frame
    }

}

Answer 2

首先，将图像视图的框架设置为尚未在viewDidLoad()中定义的“根”视图的框架。使用约束并让自动布局调整视图大小会更好。

第二，如果您要在viewDidLoad()或什至在viewDidLayoutSubviews()中开始动画，则屏幕仍不可见---因此您看不到初始图像（或者您只能看到它）非常简短，如果动画很短）。

因此，请从viewDidAppear()开始动画，或者稍微延迟一下，如下所示：

class ViewController: UIViewController {

    var bckgImageView = UIImageView(image: UIImage(named: "one"))

    override func viewDidLoad() {
        super.viewDidLoad()

        self.view.addSubview(bckgImageView)
        bckgImageView.translatesAutoresizingMaskIntoConstraints = false

        // constrain image view to all 4 sides
        NSLayoutConstraint.activate([
            bckgImageView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
            bckgImageView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
            bckgImageView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
            bckgImageView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
            ])

    }

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)

        // start animation after 1 second
        DispatchQueue.main.asyncAfter(deadline: .now() + 1.0, execute: {
            self.animateBackground()
            })

    }

    func animateBackground() {

        UIView.transition(with: self.view,
                          duration: 5,
                          options: .transitionCrossDissolve,
                          animations: { self.bckgImageView.image = UIImage(named: "two") },
                          completion: nil)

    }
}

尝试在UIImageView中的图像之间淡入淡出时出现白屏

2 个答案: