Skip to content

PxAnimation (PxUIKit)

Jonathan Cichon edited this page Mar 26, 2014 · 2 revisions

More and more Transitions in iOS are linked to an interactive element like a gesture recognizer or some other logic. Apple provides us with some nice Features like UIPercentDrivenInteractiveTransition but it is hard to switch between interactive Transitions and Animations without interaction. PxAnimation is my approach to support the same step-by-step control over what happens on the screen, as an interactive Transition does.

The Interface is quite simple

2 methods to start a animation-context 1 method to add animation blocks and 1 method to cancel an running animation.

starting a normal animation-context

+ (PxAnimation *)pxAnimatePercentDriven:(NSTimeInterval)duration
                                  curve:(CAMediaTimingFunction *)curve
                             animations:(void (^)(void))animations
                             completion:(void (^)(BOOL finished))completion

starting a oscilatting animation-context

+ (PxAnimation *)pxAnimatePercentDriven:(NSTimeInterval)duration
                                  curve:(CAMediaTimingFunction *)curve
                   numberOfOscilattions:(NSUInteger)numberOfOscilattions
                       overBounceFactor:(CGFloat)overBounceFactor
                             animations:(void (^)(void))animations
                             completion:(void (^)(BOOL finished))completion

adding a action block

+ (void)pxAddPercentAnimations:(void (^)(NSTimeInterval percent))animations

cancling an animation

- (void)cancelAnimation

Example Code

The following code moves a view along the border of a circle:

CGPoint originalCenter = view.center;
CGFloat radius = 20;
originalCenter.x -= radius;
[PxAnimation pxAnimatePercentDriven:5 curve:function animations:^{
    [PxAnimation pxAddPercentAnimations:^(NSTimeInterval percent) {
        CGFloat x = radius * cosf(percent*M_PI*2);
        CGFloat y = radius * sinf(percent*M_PI*2);
        CGPoint offset = {x,y};
        [view setCenter:CGPointAdd(originalCenter, offset)];
    }];
} completion:nil];