天天看點

走進 Facebook POP 的世界

走進 Facebook POP 的世界

POP: 一個流行的可擴充的動畫引擎iOS,它支援spring和衰變動态動畫,使其可用于建構現實,基于實體互動。Objective - C API允許快速內建, 對于所有的動畫和過渡他是成熟的.

解釋:

1.1 POP 使用 Objective-C++ 編寫,Objective-C++ 是對 C++ 的擴充,就像 Objective-C 是 C 的擴充。而至于為什麼他們用 Objective-C++ 而不是純粹的 Objective-C. 可能是偏愛。-.O

1.2 POP 目前由四部分組成:1. Animations;2. Engine;3. Utility;4. WebCore。下圖有助于你更好的了解它的架構

走進 Facebook POP 的世界

1.它支援CocoaPods 你可以這樣

pod 'pop', '~> 1.0.8'

2.或者這樣點選下載下傳拉入工程 https://github.com/facebook/pop

3.我使用的Cocoapods 是以使用之前你需要這樣

#import <POP.h>

動圖

走進 Facebook POP 的世界

E1:

- (void)clickPopAction {     // kPOPLayerPositionY 向下     // kPOPLayerPositionX 向右     POPSpringAnimation *anim = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerPositionY];     // 移動距離     anim.toValue = [[NSNumber alloc] initWithFloat:_btnPop.center.y + 200];     // 從目前 + 1s後開始     anim.beginTime = CACurrentMediaTime() + 1.0f;     // 彈力--晃動的幅度 (springSpeed速度)     anim.springBounciness = 15.0f;     [_btnPop pop_addAnimation:anim forKey:@"position"];     POPSpringAnimation *anim1 = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerBounds];     anim1.toValue = [NSValue valueWithCGRect:CGRectMake(100, 100, 99, 99)];     [_btnPop pop_addAnimation:anim1 forKey:@"size"]; }
走進 Facebook POP 的世界

E2:在很多金融類app中比較常見、支付寶中的餘額包、京東金融餘額、就類似這樣

// 初始化     POPBasicAnimation *anim = [POPBasicAnimation animation];     // 限時 1s     anim.duration = 3.0;     POPAnimatableProperty * prop = [POPAnimatableProperty propertyWithName:@"count++" initializer:^(POPMutableAnimatableProperty *prop) {         prop.readBlock = ^(id obj, CGFloat values[]){ values[0] = [[obj description] floatValue]; };         prop.writeBlock = ^(id obj, const CGFloat values[])         {             [obj setText:[NSString stringWithFormat:@"%.2f",values[0]]];         };         prop.threshold = 0.01;     }];     anim.property = prop;     anim.fromValue = @(0.0);     anim.toValue = @(1314.52);     [self.xt_countLabel pop_addAnimation:anim forKey:@"counting"];
走進 Facebook POP 的世界

E3

CALayer *layer0 = [CALayer layer];     layer0.opacity = 1.0;     layer0.transform = CATransform3DIdentity;     [layer0 setMasksToBounds:YES];     [layer0 setBackgroundColor:[UIColor colorWithRed:0.5448 green:0.6836 blue:0.9986 alpha:1.0].CGColor];     [layer0 setCornerRadius:12.5];     [layer0 setBounds:CGRectMake(0, 0, 25, 25)];     [self.view.layer addSublayer:layer0];     layer0.position = CGPointMake(self.view.center.x, 266);     [self performAnimation:layer0];
- (void)performAnimation:(CALayer *)layer     [layer pop_removeAllAnimations];     POPBasicAnimation *anim = [POPBasicAnimation animationWithPropertyNamed:kPOPLayerScaleXY];     static BOOL ani = YES;     if (ani) {         anim.toValue = [NSValue valueWithCGPoint:CGPointMake(1.0, 1.0)];     }else{         anim.toValue = [NSValue valueWithCGPoint:CGPointMake(1.5, 1.5)];     }     ani = !ani;     anim.completionBlock = ^(POPAnimation *anim, BOOL finished) {         if (finished) { [self performAnimation:layer]; }     };     [layer pop_addAnimation:anim forKey:@"Animation"];