版本记录
| 版本号 | 时间 |
|---|---|
| V1.0 | 2017.12.17 |
前言
POP框架是
1. Facebook Pop动画框架详细解析（一） —— 基本概览
2. Facebook Pop动画框架详细解析（二） —— 基本架构
3. Facebook Pop动画框架详细解析（三） —— spring动画简单实例
功能需求
实现POP的decay动画。
功能实现
首先要了解几个参数。
-
velocity：衰减速度，必须和你操作的属性有相同的结构，如果你操作的是bounds，想实现一个水滴滴到桌面的扩散效果，那么应该是[NSValue valueWithCGRect:CGRectMake(0, 0,20.0, 20.0)]，如果 velocity 是负值，那么就会反向递减。 -
fromValue：Decay 的动画没有 toValue 只有 fromValue，然后按照 velocity 来做衰减操作。 -
deceleration： （负加速度） 是一个你会很少用到的值，默认是就是我们地球的 0.998，如果你开发给火星人用，那么这个值你使用 0.376 会更合适。
看一下API
#import <pop/POPPropertyAnimation.h>
/**
@abstract A concrete decay animation class.
@discussion Animation is achieved through gradual decay of animation value.
*/
@interface POPDecayAnimation : POPPropertyAnimation
/**
@abstract The designated initializer.
@returns An instance of a decay animation.
*/
+ (instancetype)animation;
/**
@abstract Convenience initializer that returns an animation with animatable property of name.
@param name The name of the animatable property.
@returns An instance of a decay animation configured with specified animatable property.
*/
+ (instancetype)animationWithPropertyNamed:(NSString *)name;
/**
@abstract The current velocity value.
@discussion Set before animation start to account for initial velocity. Expressed in change of value units per second. The only POPValueTypes supported for velocity are: kPOPValuePoint, kPOPValueInteger, kPOPValueFloat, kPOPValueRect, and kPOPValueSize.
*/
@property (copy, nonatomic) id velocity;
/**
@abstract The original velocity value.
@discussion Since the velocity property is modified as the animation progresses, this property stores the original, passed in velocity to support autoreverse and repeatCount.
*/
@property (copy, nonatomic, readonly) id originalVelocity;
/**
@abstract The deceleration factor.
@discussion Values specifies should be in the range [0, 1]. Lower values results in faster deceleration. Defaults to 0.998.
*/
@property (assign, nonatomic) CGFloat deceleration;
/**
@abstract The expected duration.
@discussion Derived based on input velocity and deceleration values.
*/
@property (readonly, assign, nonatomic) CFTimeInterval duration;
/**
The to value is derived based on input velocity and deceleration.
*/
- (void)setToValue:(id)toValue NS_UNAVAILABLE;
/**
@abstract The reversed velocity.
@discussion The reversed velocity based on the originalVelocity when the animation was set up.
*/
- (id)reversedVelocity;
@end
下面我们就看一下代码
1. ViewController.m
#import "ViewController.h"
#import "POP.h"
@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIView *animaObjectView;
@end
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
}
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
[self loadDecayAnimation];
}
#pragma mark - Action && Notification
- (void)loadDecayAnimation
{
POPDecayAnimation *decayAnimation = [POPDecayAnimation animationWithPropertyNamed:kPOPLayerPositionY];
[self.animaObjectView.layer pop_addAnimation:decayAnimation forKey:@"decayAnimation"];
decayAnimation.velocity = @(300.0);
decayAnimation.fromValue = @(200.0);
decayAnimation.completionBlock = ^(POPAnimation *anim, BOOL finished){
if (finished) {
NSLog(@"动画结束了");
[self.animaObjectView.layer pop_removeAnimationForKey:@"decayAnimation"];
[self loadDecayAnimation];
}
};
}
@end
这个动画就是kPOPLayerPositionY值从初始值200进行衰减的动画，衰减速度是300。
功能效果
下面我们就看一下实现的功能效果。
后记
未完，待续~~~
