ios - Swift iOS 具有相同 UIView 的多个连续多个动画？

Question

这就是我现在的位置。我仍然无法让它工作，并且我尝试了很多变体。这是我的单个动画的原始代码。

导入 UIKit

class ViewController: UIViewController {

    @IBOutlet weak var imageView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        var images = [UIImage]()
        var images2 = [UIImage]()

        images += [#imageLiteral(resourceName: "circle1"), #imageLiteral(resourceName: "circle2"), #imageLiteral(resourceName: "circle3"), #imageLiteral(resourceName: "circle4")]
        images2 += [#imageLiteral(resourceName: "circle4"), #imageLiteral(resourceName: "circle3"), #imageLiteral(resourceName: "circle2"), #imageLiteral(resourceName: "circle1")]

        imageView.animationImages = images
        imageView.animationDuration = 4.0
        imageView.animationRepeatCount = 2
        imageView.startAnimating()
    }
}

我能够使用我为持续时间和计数设置的属性为第一个图像数组设置动画。但是，我只是不明白我将如何编写此代码以添加第二组图像以在之后立即设置动画。我知道我需要以某种方式使用它:

UIView
    .animate(withDuration: 4.0,
             animations: {
                //animation 1
    },
             completion: { _ in
                UIView.animate(withDuration: 6.0,
                               animations: {
                                //animation 2
                })
    })

如果我当前的图像数组使用相同的 imageView 对象来显示两个动画，有人可以告诉我如何写这个吗？我希望我的第一个动画(图像)持续时间为 4 秒，第二个动画(图像 2)在第一个动画之后的持续时间为 6 秒。我无法弄清楚动画参数中我需要什么。

Answer 1

我认为错误是你在这里混合了两件事:

• UIView.animate -> 动画控件和属性
• UIImageView.startAnimating -> 在 UIImageView 中启动图像循环

但他们不一样，他们非常独立。但 UIView 动画通常用于其他用例。只有一件事是它们可能与您的 UIImageView 动画具有相同的持续时间，但您没有设置 UIImageView 的持续时间。也许当您将 ImageView 的动画持续时间设置为 UIView 动画的持续时间时，它会在相同的时间范围内完成。

myImageView.animationDuration = 2;

第二个循环

myImageView.animationDuration = 4;

其他解决方案

问题是您需要知道图像循环何时完成。但是没有这方面的事件(我没有找到)

StackOverflow 上有一些解决方案:

1 performSelector afterDelay

设置一个计时器在持续时间结束后触发。为此，您还需要为 ImageView 添加动画持续时间:

myImageView.animationDuration = 0.7;

此处的解决方案:how to do imageView.startAnimating() with completion in swift? :

When the button is pressed you can call a function with a delay

self.performSelector("afterAnimation", withObject: nil, afterDelay: imageView1.animationDuration)

Then stop the animation and add the last image of imageArray to the imageView in the afterAnimation function

func afterAnimation() {
    imageView1.stopAnimating()
    imageView1.image = imageArray.last
}

2 计时器

这类似于 performSelector afterDelay 但带有 NSTimer。

您可以在此处找到描述 UIImageView startAnimating: How do you get it to stop on the last image in the series? :

1) Set the animation images property and start the animation (as in your code in the question)

2) Schedule an NSTimer to go off in 'animationDuration' seconds time

3) When the timer goes off, [...]

添加到第3点:然后开始下一个动画

3 CA交易

此处的解决方案:Cocoa animationImages finish detection (您需要将其转换为 swift 3 语法，但它可以作为起点

Very old question, but I needed a fix now, this works for me:

[CATransaction begin];
[CATransaction setCompletionBlock:^{
    DLog(@"Animation did finish.");
}];

UIImageView *imageView = [[UIImageView alloc] initWithFrame:self.window.bounds];
imageView.animationDuration = 0.3 * 4.0;
imageView.animationImages = @[[UIImage AHZImageNamed:@"Default2"],
                              [UIImage AHZImageNamed:@"Default3"],
                              [UIImage AHZImageNamed:@"Default4"],
                              [UIImage AHZImageNamed:@"Default5"]];
imageView.animationRepeatCount = 1;
[self.window addSubview:imageView];

[imageView startAnimating];

[CATransaction commit];

4 Offtopic:手动做图片动画

这有点离题，因为这里他们手动制作图像动画。对于您的用例，您只需更改索引中的图像可见的逻辑。向前计数直到最后一张图像，然后向后计数直到第一张图像。然后停止循环。不是很好的解决方案，但在此解决方案中添加了图像过渡动画:

此处的解决方案:Adding Image Transition Animation in Swift

class ViewController: UIViewController {
        @IBOutlet weak var imageView: UIImageView!

        let images = [
                UIImage(named: "brooklyn-bridge.jpg")!,
                UIImage(named: "grand-central-terminal.jpg")!,
                UIImage(named: "new-york-city.jpg"),
                UIImage(named: "one-world-trade-center.jpg")!,
                UIImage(named: "rain.jpg")!,
                UIImage(named: "wall-street.jpg")!]
        var index = 0
        let animationDuration: NSTimeInterval = 0.25
        let switchingInterval: NSTimeInterval = 3

        override func viewDidLoad() {
                super.viewDidLoad()

                imageView.image = images[index++]
                animateImageView()
        }

        func animateImageView() {
                CATransaction.begin()

                CATransaction.setAnimationDuration(animationDuration)
                CATransaction.setCompletionBlock {
                        let delay = dispatch_time(DISPATCH_TIME_NOW, Int64(self.switchingInterval * NSTimeInterval(NSEC_PER_SEC)))
                        dispatch_after(delay, dispatch_get_main_queue()) {
                                self.animateImageView()
                        }
                }

                let transition = CATransition()
                transition.type = kCATransitionFade
                /*
                transition.type = kCATransitionPush
                transition.subtype = kCATransitionFromRight
                */
                imageView.layer.addAnimation(transition, forKey: kCATransition)
                imageView.image = images[index]

                CATransaction.commit()

                index = index < images.count - 1 ? index + 1 : 0
        }
}

Implement it as a custom image view would be better.