Skip to content

Wrapper around UIView animations to facilitate chaining

License

Notifications You must be signed in to change notification settings

leoformaggio/NUAnimationKit

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

96 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

####UIView animation wrapper to facilitate chaining of animation commands.

###Problem Chaining of UIView animations requires the use of completion handler blocks to chain commands together:

[UIView animateWithDuration:0.5
                          delay:0
                        options:0
                     animations:^{
                         [animationView1 setFrameY:400];
                         animationView1.backgroundColor = [UIColor grayColor];
                     }
                     completion:^(BOOL finished) {
                         [UIView animateWithDuration:0.3
                                               delay:0.1
                                             options:UIViewAnimationOptionCurveEaseInOut
                                          animations:^{
                                              [animationView2 setFrameY:400];
                                          }
                                          completion:^(BOOL finished) {
                                              [UIView animateWithDuration:0.5
                                                                    delay:0
                                                   usingSpringWithDamping:0.5
                                                    initialSpringVelocity:0
                                                                  options:0
                                                               animations:^{
                                                                   [animationView3 setFrameY:400];
                                                               }
                                                               completion:nil];
                                          }];
                     }];

Which isn't a particularly elegant solution, and is hard to read.

Features

UIView animation chaining

This library creates a wrapper around UIView animations that facilitates chaining via a simple syntax:

NUAnimationController *controller = [[NUAnimationController alloc] init];

[self.controller addAnimation:^{
    [animationView1 setFrameY:400];
    animationView1.backgroundColor = [UIColor grayColor];
}].withAnimationOption(UIViewAnimationOptionTransitionCrossDissolve);
    
[self.controller addAnimation:^{
    [animationView2 setFrameY:400];
}].withDelay(0.1).withDuration(0.3).withCurve(UIViewAnimationCurveEaseInOut);
    
[self.controller addAnimation:^{
    [animationView3 setFrameY:400];
}].withType(NUAnimationTypeSpringy).withDuration(NUSpringAnimationNaturalDuration);

To achieve chaining in different objects:

NUAnimationKit also allows you to set animation options on creation:

[controller addAnimation:^{
    //Animations
}].withDelay(0.1).withDuration(0.3).withCurve(UIViewAnimationCurveEaseInOut);

And spring-based animations:

controller addAnimation:^{
    //Springy
}].withType(NUAnimationTypeSpringy).withDuration(NUSpringAnimationNaturalDuration)

Where NUSpringAnimationNaturalDuration is a constant that will automatically calculate the optimal spring animation duration based on physical properties like mass and elastic constant.

Like so:

Progress-based explicit animations

And also adds support for progress-based blocks, for properties that may not be directly animatable.

They can be animated alongside another UIView animation:

[controller addAnimation:^{
    //Main animation
}].alongSideBlock(^(CGFloat progress){
    progressLabel.text = [NSString stringWithFormat:@"%f", progress];
});

Or created entirely on their own:

[self.controller addProgressAnimations:^(CGFloat progress) {
  progressLabel.text = [NSString stringWithFormat:@"%f", progress];
}].withDuration(2);

Like setting a string value:

Progress-based UIView animations

NUAnimationKit also supports creating parametrized animations using simple UIView animation blocks

1 - Build your block animation as usual, but setting the views associated with the transformations you are making:

[self.controller addAnimations:^{
     [animationView1 setFrameY:400];
     animationView1.backgroundColor = [UIColor grayColor];
}].withAnimationOption(UIViewAnimationOptionTransitionCrossDissolve)
.withDuration(2)
.withAssociatedViews(@[animationView1]);

Note: You may still add as many animation blocks as you like. The order, duration and delay of each one will be preserved.

2 - Call the progress update block whenever you need to change the animation state:

[self.controller animateToProgress:progress];

Caveats:

This animation method does not support the chaining of before and after blocks.

Installation

NUAnimationKit is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "NUAnimationKit"

Usage

To use the library, simply:

  • Install the pod by adding pod "NUAnimationKit" to your podfile
  • Import NUAnimationController.h
  • Create an animation controller:
NUAnimationController *controller = [[NUAnimationController alloc] init];
  • Add animation blocks:
[controller addAnimation:^{
    //Springy
}].withType(NUAnimationTypeSpringy).withDuration(NUSpringAnimationNaturalDuration)
  • Start the animation:
[controller startAnimationChain]

or

[controller startAnimationChainWithCompletionBlock:^{
//Optional completion block
}];
  • Profit

Requirements

Built for iOS 8.0 and above.

Author

Victor Maraccini, victor.maraccini@nubank.com.br

License

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

About

Wrapper around UIView animations to facilitate chaining

Resources

License

Stars

Watchers

Forks

Packages

No packages published