Consecutive Animations - Watchkit

Question

I'm looking to have a variety of animations for an apple watch app. I'm using a series of images and the method of animation is startAnimatingWithImagesInRange(). Any time I have consecutive animation instructions, only the last one in the code executes. Code looks like:

myImage.setImageNamed("testImage")

myImage.startAnimatingWithImagesInRange(NSRange(location: 0, length: 90), duration: 3, repeatCount: 1)

myImage.startAnimatingWithImagesInRange(NSRange(location: 90, length: 180), duration: 3, repeatCount: 1)

In the above code, only the second animation would play. I even tried putting them in separate functions, so I would be calling each function individually, but it still will only play the last animation in my code. I'm fairly new to this so I'm sure there is a better way but after hours and hours of research I haven't been able to come up with a solution or find one online.

Answer 1

The watch won't queue up animations for you, so use an NSTimer with a delay equal to the duration of the first animation and start the second animation once the timer fires.

Answer 2

This is easy as 1 + 1 :)

Here is what you want:

myImage.setImageNamed("testImage")

let duration = 3
let repeatCount = 1

Timeline.with(identifier: "MyQueuedAnimation", delay: 0.0, duration: duration * repeatCount, execution: {

    myImage.startAnimatingWithImagesInRange(NSRange(location: 0, length: 90), duration: duration, repeatCount: repeatCount)

}, completion: {

    myImage.startAnimatingWithImagesInRange(NSRange(location: 90, length: 180), duration: duration, repeatCount: 1)

}).start

TimelineKit - feel free to give me some feedback for my little framework. :)