Easy to read and write chainable animations in Objective-C and Swift


language language Version Build Status MIT License Platform Platform

Whats new in version 3.x?

  • Swiftier syntax
  • Swift 4 support
  • Bug fixes and improvements

Whats new in version 2.x?

  • Re-architected from the ground up, no more hacking UIView 🛠
  • Added pre-animation and post-animation hooks for each animation step
  • Added pause and resume functionality
  • Added repeat animation functionality 🔂
  • Added friendly Swift interface in separate framework 🔥 🕊

Whats wrong with animations?

CAAnimations and UIView animations are extremely powerful, but it is difficult to chain multiple animations together, especially while changing anchor points.

Furthermore, complicated animations are difficult to read.

Say I want to move myView 50 pixels to the right with spring and then change the background color with inward easing when the movement has finished:

The Old Way

    [UIView animateWithDuration:1.0
                        options:0 animations:^{
                            CGPoint newPosition = self.myView.frame.origin;
                            newPosition.x += 50;
                            self.myView.frame.origin = newPosition;
    } completion:^(BOOL finished) {
        [UIView animateWithDuration:0.5
            self.myView.backgroundColor = [UIColor purpleColor];
        } completion:nil];

Thats pretty gross huh... With JHChainableAnimations it is one line of code.

Using JHChainableAnimations

JHChainableAnimator *animator = [[JHChainableAnimator alloc] initWithView:self.myView];
animator.moveX(50).spring.thenAfter(1.0).makeBackground([UIColor purpleColor]).easeIn.animate(0.5);

There are also a lot of really good animation libraries out there such as RBBAnimation, DCAnimationKit, and PMTween, but they still fall short of having powerful chainable animations AND easy to read/write syntax.


There are a few ways you can add this framework to your project. The Objective-C framework is called JHChainableAnimations and the Swift framework is called ChainableAnimations. More notes on Swift usage can be found here


pod 'JHChainableAnimations', '~> 3.0.1'

Then add the following:

#import <JHChainableAnimations/JHChainableAnimations.h>
pod 'ChainableAnimations', '~> 3.0.1'

Then add the following:

import ChainableAnimations


Add the following to your Cartfile

github "jhurray/JHChainableAnimations" ~> 3.0.1

Add the JHChainableAnimations framework to your project.


Add the ChainableAnimations framework to your project.

Add to project Manually

Either clone the repo and manually add the Files in JHChainableAnimations


Creating an Animator

To create an instance of JHChainableAnimator you must call the initWithView: method.

JHChainableAnimator *animator = [[JHChainableAnimator alloc] initWithView:self.myView];


Chainable properties like moveX(x) must come between the view and the animate(t) function

Below is an example of how to double an objects size over the course of one second.


Combining Animations

If you want to move the view while you scale it, add another chainable property. Order is not important

animator.makeScale(2.0).moveXY(100, 50).animate(1.0);
// the same as animator.moveXY(100, 50).makeScale(2.0).animate(1.0);

A full list of chainable properties can be found here

Chaining Animations

To chain animations seperate the chains with the thenAfter(t) function.

Below is an example of how to scale and object for 0.5 seconds, and then move it for 1 second when that is done.

animator.makeScale(2.0).thenAfter(0.5).moveXY(100, 50).animate(1.0);

Animation Effects

To add an animation effect, call the effect method after the chainable property you want it to apply to.

Below is an example of scaling a view with a spring effect.


If you add 2 to the same chainable property the second will cancel the first out.

// The same as animator.makeScale(2.0).spring.animate(1.0);

A full list of animation effect properties can be found here


To anchor your view call an achoring method at some point in an animation chain. Like effects, calling one after another in the same chain will cancel the first out.

Below is an example of rotating a view around different anchor points


// animator.rotateZ(90).anchorTopLeft.anchorCenter == animator.rotateZ(90).anchorCenter

A full list of anchor properties can be found here


To delay an animation call the wait(t) or delay(t) chainable property.

Below is an example of moving a view after a delay of 0.5 seconds

animator.moveXY(100, 50).wait(0.5).animate(1.0);
// The same as animator.moveXY(100, 50).delay(0.5).animate(1.0);


To run code after an animation finishes set the completionBlock property of your animator or call the animateWithCompletion(t, completion)*function.

animator.makeX(0).animateWithCompletion(1.0, ^{
	NSLog(@"Animation Done");

Is the same as:

animator.completionBlock = ^{
	NSLog(@"Animation Done");

Repeating Animations

You can repeat an animation by replacing the thenAfter(time) method with the repeat(time, count) method. This will repeat the previously defined animations.

// The animator will double its scale 3 times for 0.5 seconds each before it calls `moveXY` and finishes the animation
animator.makeScale(2.0).repeat(0.5, 3).moveXY(100, 50).animate(1.0);

You can repeat the last part of an animation by calling animateWithRepeat(time, count).

// The animator will double its scale then rotate by 90 degrees 3 times for 1 second each.
animator.makeScale(2.0).thenAfter(0.5).rotate(90). animateWithRepeat(1.0, 3);

Pausing and Cancelling

To Pause the animation, call the pause method on the animator. When you call pause, the current animation in the chain will complete but nothing beyod that will be executed. You can use the isPaused and isAnimating readonly properties to inspect state. If an animation is paused but not stopped, it will still evaluate as animating.

To resume in a paused state, call the resume method on the animator.

To stop animation and clear state, call the stop method on the animator.

// In this case the `moveX` animation will execute but the `moveY` will not
// If `resume` is called `moveY` will be executed
// If `stop` is called, nothing will be executed and the animator will get a fresh state
[animator pause];


You can hook into the different steps of the animation process by calling the preAnimationBlock(block), animationBlock(block), and postAnimationBlock(block) methods. All take a simple block void(^)() as an argument. Order of calling these in the animation chain does not matter.

	NSLog(@"before the first animation");
 	NSLog(@"After the second animation");

Bezier Paths

You can also animate a view along a UIBezierPath. Create a UIBezierPath * instance, then add points or curves or lines to it and use it in a chainable property.

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:self.myView.center];
[path addLineToPoint:CGPointMake(25, 400)];
[path addLineToPoint:CGPointMake(300, 500)];

Animation effects do not work on path movements.

Using with Auto Layout


Use the transform chainable properties. These are better for views constrained with Autolayout. You should not mix these with other chainable properties


Using with Swift

Using JHChainableAnimations with Swift is now a little more readable in version 2.x. I created a separate framework for swift that provides a class called ChainableAnimator. This is a thin wrapper over JHChainableAnimator that has a slightly more readable syntax.

let animator = ChainableAniamtor(view: myView)
animator.moveX(x: 50).thenAfter(t: 1.0).rotate(angle: 360).bounce.animate(t:1.0)

All Objective-C methods map to a swift method.

Chainable Properties

Property Takes a... Usage
- (JHChainableRect) makeFrame; CGRect animator.makeFrame(rect).animate(1.0);
- (JHChainableRect) makeBounds; CGRect animator.makeBounds(rect).animate(1.0);
- (JHChainableSize) makeSize; (CGFloat: width, CGFloat: height) animator.makeSize(10, 20).animate(1.0);
- (JHChainablePoint) makeOrigin; (CGFloat: x, CGFloat: y) animator.makeOrigin(10, 20).animate(1.0);
- (JHChainablePoint) makeCenter; (CGFloat: x, CGFloat: y) animator.makeCenter(10, 20).animate(1.0);
- (JHChainableFloat) makeX; (CGFloat: f) animator.makeX(10).animate(1.0);
- (JHChainableFloat) makeY; (CGFloat: f) animator.makeY(10).animate(1.0);
- (JHChainableFloat) makeWidth; (CGFloat: f) animator.makeWidth(10).animate(1.0);
- (JHChainableFloat) makeHeight; (CGFloat: f) animator.makeHeight(10).animate(1.0);
- (JHChainableFloat) makeOpacity; (CGFloat: f) animator.makeOpacity(10).animate(1.0);
- (JHChainableColor) makeBackground; (UIColor: color) animator.makeBackground(color).animate(1.0);
- (JHChainableColor) makeBorderColor; (UIColor: color) animator.makeBorderColor(color).animate(1.0);
- (JHChainableFloat) makeBorderWidth; (CGFloat: f) animator.makeBorderWidth(3.0).animate(1.0);
- (JHChainableFloat) makeCornerRadius; (CGFloat: f) animator.makeCornerRadius(3.0).animate(1.0);
- (JHChainableFloat) makeScale; (CGFloat: f) animator.makeScale(2.0).animate(1.0);
- (JHChainableFloat) makeScaleX; (CGFloat: f) animator.makeScaleX(2.0).animate(1.0);
- (JHChainableFloat) makeScaleY; (CGFloat: f) animator.makeScaleY(2.0).animate(1.0);
- (JHChainablePoint) makeAnchor; (CGFloat: x, CGFloat: y) animator.makeAnchor(0.5, 0.5).animate(1.0);
- (JHChainableFloat) moveX; (CGFloat: f) animator.moveX(50).animate(1.0)
- (JHChainableFloat) moveY; (CGFloat: f) animator.moveY(50).animate(1.0)
- (JHChainablePoint) moveXY; (CGFloat: x, CGFloat: y) animator.moveXY(100, 50).animate(1.0)
- (JHChainableFloat) moveHeight; (CGFloat: f) animator.moveHeight(50).animate(1.0)
- (JHChainableFloat) moveWidth; (CGFloat: f) animator.moveWidth(50).animate(1.0)
- (JHChainableDegrees) rotateX; (CGFloat: angle) #not radians! animator.rotateX(360).animate(1.0);
- (JHChainableDegrees) rotateY; (CGFloat: angle) #not radians! animator.rotateY(360).animate(1.0);
- (JHChainableDegrees) rotateZ; (CGFloat: angle) #not radians! animator.rotateZ(360).animate(1.0);
- (JHChainablePolarCoordinate) movePolar; (CGFloat: radius, CGFloat: angle) animator.movePolar(30, 90).animate(1.0);
- (JHChainableBezierPath) moveOnPath; (UIBezierPath *path) animator.moveOnPath(path).animate(1.0);
- (JHChainableBezierPath) moveAndRotateOnPath; (UIBezierPath *path) animator.moveAndRotateOnPath(path).animate(1.0);
- (JHChainableBezierPath) moveAndReverseRotateOnPath; (UIBezierPath *path) animator.moveAndReverseRotateOnPath(path).animate(1.0);
- (JHChainableFloat) transformX; (CGFloat f) animator.transformX(50).animate(1.0);
- (JHChainableFloat) transformX; (CGFloat f) animator.transformX(50).animate(1.0);
- (JHChainableFloat) transformY; (CGFloat f) animator.transformY(50).animate(1.0);
- (JHChainableFloat) transformZ; (CGFloat f) animator.transformZ(50).animate(1.0);
- (JHChainablePoint) transformXY; (CGFloat x, CGFloat y) animator.transformXY(50, 100).animate(1.0);
- (JHChainableFloat) transformScale; (CGFloat f) animator.transformScale(50).animate(1.0);
- (JHChainableFloat) transformScaleX; (CGFloat f) animator.transformScaleX(50).animate(1.0);
- (JHChainableFloat) transformScaleY; (CGFloat f) animator.transformScaleY(50).animate(1.0);
- (JHChainableAnimator *) transformIdentity; Nothing animator.transformIdentity.animate(1.0);

Animation Effects

A quick look at these funcs can be found here

These animation functions were taken from a cool keyframe animation library that can be found here

They are based off of JQuery easing functions that can be found here


Info on anchoring can be found here

To Do

I have gotten a ton of great suggestions of what to do next. If you think this is missing anything please let me know! The following is what I plan on working on in no particular order.

  • OSX port
  • Constraint animator

Contact Info && Contributing

Feel free to email me at [email protected]. I'd love to hear your thoughts on this, or see examples where this has been used.

MIT License

  • Stop support for iOS 8/7?

    Stop support for iOS 8/7?

    the minimum deployment target is iOS9 which is declare in "JHChainableAnimations.podspec" file: s.ios.deployment_target = '9.0'

    opened by bellchen 6
  • ios 7/8 support

    ios 7/8 support

    • downgrade deployment target for ios 7 and 8
    opened by AYastrebov 6
  • Swift?


    Is there a way to get this working with Swift?

    I can get it to compile by changing:

    #import "NSBKeyframeAnimationFunctions/NSBKeyframeAnimationFunctions.h"


    #import "NSBKeyframeAnimationFunctions.h"

    but attempting to animate a button:


    doesn't compile.

    opened by cannyboy 5
  • Order of  callbacks

    Order of callbacks

    Hi! I test version 2 and found that the callbacks pre and post are called at the same time:

    JHChainableAnimator *animator = [[JHChainableAnimator alloc] initWithView:self.label];
        transformScale(0.01f).makeOpacity(0.0f).postAnimationBlock(@weakself(^() ){
            NSLog(@"postAnimationBlock %@",[NSDate date]);
        preAnimationBlock(@weakself(^() ){
            NSLog(@"preAnimationBlock %@",[NSDate date]);
        animationBlock(@weakself(^() ){
            NSLog(@"animationBlock %@",[NSDate date]);
        postAnimationBlock(@weakself(^() ){
            NSLog(@"postAnimationBlock %@",[NSDate date]);
        animationBlock(@weakself(^() ){
            NSLog(@"animationBlock %@",[NSDate date]);
        preAnimationBlock(@weakself(^() ){
            NSLog(@"preAnimationBlock %@",[NSDate date]);


    preAnimationBlock 2017-02-07 16:53:35 +0000 animationBlock 2017-02-07 16:53:35 +0000 postAnimationBlock 2017-02-07 16:53:35 +0000

    preAnimationBlock 2017-02-07 16:53:45 +0000 animationBlock 2017-02-07 16:53:45 +0000 postAnimationBlock 2017-02-07 16:53:45

    This is a bug or something I do not understand?

    opened by andrey-morozov 5
  • Adding a .animationCompletion causes view to flash after animation finishes

    Adding a .animationCompletion causes view to flash after animation finishes

    For example, given _myButton

    self.myButton.animationCompletion = JHAnimationCompletion() { NSLog(@"Done!"); }); self.myButton.makeX(5).animate(1.0);

    And myButton will flash.

    opened by andrewschreiber 5
  • Grow Action and Shrink Chain not working

    Grow Action and Shrink Chain not working

    I want to grow (scale) a view set a new value and then shrink (scale) the view to its original size again.

    I tried to do:

        var isGrowing = true
          self.badgeView?.animationCompletion = {
            if isGrowing {
              isGrowing = false
              self.badgeView?.badgeText = "\(self.selectionCounter)"

    But it does not work that way. How can I fix this?

    opened by confile 5
  • Repeat animation group?

    Repeat animation group?

    Is there an easy way to repeat an animation at the moment? It would be great to see something like view.makeScale(2.0).repeat(4).animate(3.0).

    opened by abonham 5
  • Can I spring when scale is 1.0?

    Can I spring when scale is 1.0?

    I want to spring like this:

    but myView not animation.

    I like this. Thanks!

    opened by Milker90 4
  • Rotation x y z

    Rotation x y z

    Add rotation animation around layer's x y and z axis.

    opened by BingLiuBing 4
  • Remove named parameter duplications on call site in Swift

    Remove named parameter duplications on call site in Swift

    When using this library in Swift I saw several things that don't comply with the Swift API Design Guidelines. The most striking one for me was the duplication of names by using parameter naming everywhere, even when the method name includes it already.

    In this PR I took a very conservative approach and tried to change as little as possible but still remove the duplication on the call site. For Objective-C this PR shouldn't have any impact, on Swift side the impact is little.

    For example, code previously looked something like this:

    buttonAnimator.moveY(y: -50).easeInOutExpo.animateWithCompletion(t: 1.1, completion: { ... })

    Note that moveY(y:) duplicates the Y part and that animateWithCompletion(t:completion:) duplicates the completion part.

    After my PR is merged, it will look like this:

    buttonAnimator.moveY(-50).easeInOutExpo.animate(t: 1.1, completion: { ... })

    This is not only shorter but also closer to the Swift API Design Guidelines.

    I suggest that you release a new version with a minor version bump (e.g. 2.1) with these changes. Technically it is a breaking change as existing code is not going to work as is. But Xcode provides auto-fixes for most of them.

    By the way, please consider making all calls compliant to the Design Guidelines if you ever plan to release a major upgrade. For example the above code actually might look something like the following if it was completely compliant:

    buttonAnimator.move(y: -50).ease(.inOutExpo).animate(duration: 1.1, completion: { ... })

    I also liked the changes made by @Draveness to make the animations callable directly on a view object like view.animation.move.... But that's all completely out of this PRs scope. :)

    opened by Jeehut 4
  • SPM support?

    SPM support?

    opened by StefaniOSApps 0
  • Need some help please

    Need some help please


    Keep getting an error on the above line that says:

    Argument passed to call that takes no arguments

    Please Help!!!

    opened by chadbrochill317 1
  • How do I repeat composite animation

    How do I repeat composite animation

    For example, I want a view repeat a "up-down animation". code: JHChainableAnimator *anim = [[JHChainableAnimator alloc] initWithView:view]; anim.moveY(10).thenAfter(0.2).moveY(-10).animateWithRepeat(0.2,5);

    But the view will move down once and move up five times

    opened by lylcf 2
  • New version does not work

    New version does not work


    I tried to add this library in my project, but the last changes of the last commit does not appears actually if I browse in the code. Maybe, because the name of the last version (3.0.1) is the same as the previous one.

    Please, fix it. Thanks

    opened by sanchofox 1
  • Fix OC makeFrame Bug and Swift make(height:, width:) Bug

    Fix OC makeFrame Bug and Swift make(height:, width:) Bug

    Hi, I find a bug about swift func, so I fix it.

    opened by Lision 2
  • tvOS support

    tvOS support

    opened by arnauddorgans 0
  • Change Request: Spring animation

    Change Request: Spring animation

    In current implementation spring easing is just an easeOutElastic now. I want spring animation has dampingRatio and velocity parameters and to be implemented as a real spring animation.

    Thank you.

    opened by abekert 1
  • Combine animations with different durations

    Combine animations with different durations

    Hello! I need to fade in a view while it is moving to its destination point. So I setup it with zero alpha and start coordinates, then I need to move it to the destination in 1 second and change its alpha to 1 in 0.3 second.

    Is there a possibility to do that? a.makeOpacity(1).animate(0.3).moveX(destination).animate(1) doesn't work.

    opened by abekert 2
  • Animation will be repeated when jump from the current App to the second App

    Animation will be repeated when jump from the current App to the second App

    Hello! Thank you for providing the animation library, which I recently used in my project, but I found a bug. Animation usually works normally. When I jump from the current App to the second App, and then jump back to the current App, any animation will be repeated.

    opened by lilei644 1
  • Updating Animation Parameters Mid-Animation

    Updating Animation Parameters Mid-Animation

    Say you want to move something from Point A to Point B, but while it's moving, it now needs to continue on through B to C.

    Is there a way to accomplish this currently?

    Doing it in the animateWithCompletion block results in a stop and go..

    (The functionality is built into UIView animateWithDuration w/ the UIViewAnimationOptionBeginFromCurrentState option)

    opened by victorstewart 1
Jeff Hurray
Jeff Hurray
:ocean: Declarative chainable animations in Swift

Wave Declarative chainable animations in Swift ❤️ Support my apps ❤️ Push Hero - pure Swift native macOS application to test push notifications PasteP

Khoa 123 Oct 1, 2021
(Animate CSS) animations for iOS. An easy to use library of iOS animations. As easy to use as an easy thing.

wobbly See Wobbly in action (examples) Add a drop of honey ?? to your project wobbly has a bunch of cool, fun, and easy to use iOS animations for you

Sagaya Abdulhafeez 150 Nov 6, 2021
A Swift library to take the power of UIView.animateWithDuration(_:, animations:...) to a whole new level - layers, springs, chain-able animations and mixing view and layer animations together!

ver 2.0 NB! Breaking changes in 2.0 - due to a lot of requests EasyAnimation does NOT automatically install itself when imported. You need to enable i

Marin Todorov 2.9k Nov 9, 2021
Anima is chainable Layer-Based Animation library for Swift5.

Anima Anima is chainable Layer-Based Animation library for Swift5. It support to make sequensial and grouped animation more easily. is written as foll

Satoshi Nagasaka 509 Nov 6, 2021
A collection of animations for iOS. Simple, just add water animations.

DCAnimationKit A collection of animations for iOS Simply, just add water! DCAnimationKit is a category on UIView to make animations easy to perform. E

Dalton 801 Nov 19, 2021
Various view's effects for iOS, written in Swift. Allows you to animate views nicely with easy to use extensions. Currently supported animations: Glass Break, Explode, Snowflakes. Every animation is randomized.

Various View's Effects Various view's effects for iOS, written in Swift. Allows you to animate views nicely with easy to use extensions. Every animati

Artur Rymarz 21 Aug 8, 2020
Circular reveal animations made easy

This library was created to allow developers to implement the material design's reveal effect. You can simply use this component to reveal and unverea

T-Pro 24 Jun 22, 2021
Swift UI libraries, iOS components and animations by @Ramotion

Swift UI Animation Libraries A curated list of Swift libraries, iOS UI components and UI app development by Ramotion Try these UI components and conta

Ramotion 3.4k Nov 20, 2021
A library to simplify iOS animations in Swift.

Updated for Swift 4.2 Requires Xcode 10 and Swift 4.2. Installation Drop in the Spring folder to your Xcode project (make sure to enable "Copy items i

Meng To 13.9k Nov 12, 2021
Swift interpolation for gesture-driven animations

Interpolate Interpolate is a powerful Swift interpolation framework for creating interactive gesture-driven animations. Usage The ?? idea of Interpola

Roy Marmelstein 1.8k Nov 23, 2021
SamuraiTransition is an open source Swift based library providing a collection of ViewController transitions featuring a number of neat “cutting” animations.

SamuraiTransiton is a ViewController transition framework in Swift. It is an animation as if Samurai cut out the screen with a sword. transition types

hachinobu 269 Nov 6, 2021
Composable animations in Swift

Composable animations in Swift. Blog Installation Cocoapods The easiest way to get started is to use CocoaPods. Just add the following line to your Po

Reid Chatham 196 Oct 11, 2021
Swift library for choreographing animations on the screen.

Spruce iOS Animation Library (and Android) What is it? Spruce is a lightweight animation library that helps choreograph the animations on the screen.

WillowTree, LLC 3.1k Nov 15, 2021
A library for converting Adobe AE shape based animations to a data format and playing it back on Android and iOS devices.

Keyframes Keyframes is a combination of (1) an ExtendScript script that extracts image animation data from an After Effects file and (2) a correspondi

Facebook Archive 5.4k Nov 18, 2021
Physics-based animations for iOS, tvOS, and macOS.

Advance An animation library for iOS, tvOS, and macOS that uses physics-based animations (including springs) to power interactions that move and respo

Tim Donnelly 4.4k Nov 15, 2021
A library of custom iOS View Controller Animations and Interactions.

RZTransitions is a library to help make iOS7 custom View Controller transitions slick and simple. Installation CocoaPods (Recommended) Add the followi

Rightpoint 1.9k Nov 20, 2021
Customizable download button with progress and transition animations. It is based on Apple's App Store download button.

AHDownloadButton is a customizable download button similar to the download button in the latest version of Apple's App Store app (since iOS 11). It fe

Amer Hukić 424 Nov 10, 2021
A library of custom iOS View Controller Animations and Interactions.

RZTransitions is a library to help make iOS7 custom View Controller transitions slick and simple. Installation CocoaPods (Recommended) Add the followi

Rightpoint 1.9k Nov 7, 2021