All Projects → daehn → ChainedAnimation

daehn / ChainedAnimation

Licence: MIT license
Chain multiple animations with different delays.

Programming Languages

swift
15916 projects
ruby
36898 projects - #4 most used programming language
objective c
16641 projects - #2 most used programming language

ChainedAnimation

Build Status Swift 4.2 codecov Carthage compatible CocoaPods

Usage

To run the example project, clone the repo, and run the Example application target.

Chain multiple animations with different delays. Chained animations will be started with a delay after the last one started executing.

You can create a chained animation with the -beginAnimationChain function on the UIView class.

UIView.beginAnimationChain(0.5) {
  view.frame.origin.y = 170
}.animate()

You can provide an optional delay an UIViewAnimationOptions.

UIView.beginAnimationChain(0.5, delay: 0.2, options: .CurveEaseInOut) {
  view.frame.origin.y = 170
}.animate()

To add an offset animation, use the -thenAfterStart: function and append an animation closure that will be executed as soon as the last animation started, delayed by the provided offset. Add a completion closure to the animation chain and it will be executed when the previous animation in the chain completed.

UIView.beginAnimationChain(0.5, options: .CurveEaseInOut) {
  view.frame.origin.y = 170
}.thenAfterStart(0.1) {
  // This animation will be started 0.1 seconds
  // after the previous one started
  otherView.tranform = awesomeTransform
}.thenAfterStart(0.15) {
  // More shiny animations
}.completion { bool in
  // Do something nice on completion. Or don't.
}.animate()

It is also possible to add a new chain after a previous one completed. To add a new chain call -chainAfterCompletion: and start adding animation blocks with their offset.

UIView.beginAnimationChain(0.33, options: .CurveEaseInOut) {
  view.frame.origin.y = 170
}.thenAfterStart(0.15) {
  // Start animations with a delayed start
}.completion { bool in
  // Do something nice on the completion of the first chain.
}.chainAfterCompletion(1.2, options: .CurveEaseIn) {
    // This animation will be started after the last
    // animation in the first chain completed
}.thenAfterStart(0.1) {
    // This animation will be started 0.1 seconds after
    // the first animation in the second chain started
}.completion { _ in
    // Do something nice on the completion of the second chain.
}.animate()

Author

Silvan Dähn, @silvandaehn

License

Chain is available under the MIT license. See the LICENSE file for more info.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].