Pop is an animation library created by Facebook for iOS and OSX. It provides a simple API similar to Core Animation for creating timer-based animations using CADisplayLink. Pop animations can update any object property and include built-in animation types like springs and decays. While powerful, Pop runs on the main thread so it can cause lag if the main thread is blocked during an animation.

1. Animations in iOS with
Facebook POP
Eduard Panasiuk
Minsk 2015
@edpanasiuk github.com/somedev ed.iosdev@gmail.com

2. https://github.com/facebook/pop
Pop is animation library for iOS and OS X.
Made by Facebook team for Paper app.
Written in C++/ObjectiveC++
Timer-based animation (via CADisplayLink)
Well documented and tested
Works with Swift

3. Features
• Simple API (almost identical to Core Animation)
POPSpringAnimation *springAnimation =
[POPSpringAnimation animationWithPropertyNamed:kPOPLayerBounds];
springAnimation.springBounciness = 14;
springAnimation.springSpeed = 3;
springAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 400,
400)];
[layer pop_addAnimation:springAnimation forKey:@"size"];
...
[layer pop_removeAnimationForKey:@"size"];
/* completion block */
springAnimation.completionBlock = ^(POPAnimation *anAnimation, BOOL
finished) {
NSLog(@"Animation has completed.");
};

4. Features
• Update animation on the fly
POPSpringAnimation *animation = [layer pop_animationForKey:@"myKey"];
if (animation) {
/* update to value to new destination */
animation.toValue = @(42.0);
} else {
/* create and start a new animation */
....
}

5. Features
• Pop can animate any property of any Objective-
C object
POPAnimatableProperty *prop =
[POPAnimatableProperty propertyWithName:@"com.foo.radio.volume"
initializer:^(POPMutableAnimatableProperty *property) {
// read value
prop.readBlock = ^(id obj, CGFloat values[]) {
values[0] = [obj volume];
};
// write value
prop.writeBlock = ^(id obj, const CGFloat values[]) {
[obj setVolume:values[0]];
};
// dynamics threshold
prop.threshold = 0.01;
}]

6. Animation Types
POPBasicAnimation
… and other, using custom CAMediaTimingFunction
POPBasicAnimation *basicAnimation = [POPBasicAnimation animation];
basicAnimation.timingFunction = [CAMediaTimingFunction
functionWithName:kCAMediaTimingFunctionLinear];
basicAnimation.duration = 0.5;

7. Animation Types
POPSpringAnimation
POPDecayAnimation
POPSpringAnimation *springAnimation = [POPSpringAnimation animation];
// change of value units per second
springAnimation.velocity = @(1000);
// value between 0-20 default at 4
springAnimation.springBounciness = 14;
// value between 0-20 default at 4
springAnimation.springSpeed = 3;
POPDecayAnimation *decayAnimation = [POPDecayAnimation animation];
//change of value units per second
decayAnimation.velocity = @(233);
//range of 0 to 1
decayAnimation.deceleration = .833;

8. Animation Types
POPCustomAnimation
// Return NO when animation finished
typedef BOOL (^POPCustomAnimationBlock)(id target, POPCustomAnimation
*animation);
// The current animation time at time of callback.
@property (readonly, nonatomic) CFTimeInterval currentTime;
//The elapsed animation time since last callback.
@property (readonly, nonatomic) CFTimeInterval elapsedTime;

9. Examples
https://github.com/schneiderandre/popping

10. Demo (Swift)
https://github.com/somedev/animations-in-ios

11. Drawbacks
Should you use POP? - perfect article from Vladislav
Alexeev (iOS engineer in Facebook UK)
Fig.1. Perfomance. Rotation layer across X axis
with perspective (10 seconds)

12. Drawbacks
https://medium.com/@beefon/should-you-use-pop-
b986b10d4079
Fig.2. CoreAnimation (left) vs POP(right) when main thread is
periodically blocking

13. Conclusion
+ -
Simple and powerful API Runs on Main Thread
Animate any property of any
object
More CPU load during
animation
Built in dynamic animations
Chance to get UI lag during
animation
Custom animations