动画 UIImageView 逐行出现在屏幕上

Question

我想显示带有一些动画的UIImageView，我想我想让它逐个像素地出现在屏幕上，从左到右逐行移动。有点像打印机会打印图像。 我不知道从哪里开始。

我在想也许可以用另一个可以使用动画变得透明的视图覆盖UIImageView，但是我怎样才能实现呢？

Answer 1

一个想法是，我们在您的图像之上有一个视图，将其完全覆盖。让我们将此视图称为 V。将该视图向下移动 1 个点，从而曝光图像的一行。然后在您的图像顶部有另一个视图，再次完全覆盖它。让我们将此视图称为 H。然后将该视图向右移动 1 个点。现在您的图像的一个“像素”（或者更确切地说，一个 1x1 点网格）被曝光。

我们将动画 H 向右。当它到达终点时，我们将它放回起点，将 V 和 H 下移 1 点，然后重复该过程。

这里有一些东西可以帮助您入门。

extension UIView {

    /**
     - Parameter seconds: the time for one line to reveal
     */
    func scanReveal(seconds: Double) {

        let colour = self.superview?.backgroundColor ?? UIColor.black

        let v = UIView(frame: self.bounds)
        v.backgroundColor = colour
        self.addSubview(v)

        let h = UIView(frame: self.bounds)
        h.backgroundColor = colour
        self.addSubview(h)

        v.frame.origin.y += 1

        // Animate h to the end.
        // When it reaches the end, bring it back, move v and h down by 1 and repeat.

        func move() {
            UIView.animate(withDuration: seconds, animations: {
                h.frame.origin.x = h.bounds.height
            }) { _ in
                h.frame.origin.x = 0
                h.frame.origin.y += 1
                v.frame.origin.y += 1

                if v.frame.origin.y > self.bounds.height {
                    return
                }
                move()
            }
        }
        move()
    }
}