POP默认支持三种动画 但同时也支持自定义动画

POP默认支持三种动画 但同时也支持自定义动画

POPBasicAnimation

POPSpringAnimation

POPDecayAnimation

POPCustomAnimation //自定义动画

这里我们只讨论前三种(因为自定义动画我也没用过 :) 先来看看官方的示例代码吧

官方代码示例

POPBasicAnimation

POPBasicAnimation使用最广泛 提供固定时间间隔的动画(如淡入淡出效果)

代码示例1

其动画效果如下



可以看到 添加一个动画最少仅需三步

定义一个animation对象 并指定对应的动画属性

设置初始值和默认值(初始值可以不指定 会默认从当前值开始)

添加到想产生动画的对象上

POPBasicAnimation可配置的属性与默认值为

POPBasicAnimation提供四种timingfunction(很熟悉 对不对? 就是Core Animation中那些)

kCAMediaTimingFunctionLinear

kCAMediaTimingFunctionEaseIn

kCAMediaTimingFunctionEaseOut

kCAMediaTimingFunctionEaseInEaseOut

其时间函数分别如下









POPSpringAnimation

POPSpringAnimation也许是大多数人使用POP的理由 其提供一个类似弹簧一般的动画效果(使用后 APP立马就活泼起来了 有木有?!)

代码示例23

其动画效果如下



POPSpringAnimation可配置的属性与默认值为

注意:POPSpringAnimation是没有duration字段的 其动画持续时间由以上几个参数决定

其时间函数如下



POPDecayAnimation

POPDecayAnimation提供一个过阻尼效果(其实Spring是一种欠阻尼效果) 可以实现类似UIScrollView的滑动衰减效果(是的 你可以靠它来自己实现一个UIScrollView)

代码示例3

其动画效果如下



注意:这里对POPDecayAnimation设置toValue是没有意义的 会被忽略(因为目的状态是动态计算得到的)

POPDecayAnimation可配置的属性与默认值为

注意:POPDecayAnimation也是没有duration字段的 其动画持续时间由velocity与deceleration决定

其时间函数如下



接下来我们看一下POP默认支持哪些属性的动画 打开POPAnimatablePropery.h可以看到如下定义(这些是到目前为止 所支持的属性 随着版本的更新 还在不断的新增中 :)

作为刚接触POP的一些同学来说 如果在上面看到你希望的某些属性的话 你可以像官方代码示例一样指定这个属性即可开始动画了

但是如果你想要的某些属性不在之上呢 这时候自定义属性POPAnimatableProperty就排上用场了

自定义属性

POP默认支持的三种动画都继承自POPPropertyAnimation POPPropertyAnimation中定义了一个叫property的属性(
之前没有用到它是因为POP根据不同的默认动画属性帮你生成了默认的property) 而这个property则是用来驱动POP的动画效果中的重要一环

代码示例4

其组成就是一个readBlock一个writeBlock和一个threashold

readBlock告诉POP当前的属性值

writeBlock中修改变化后的属性值

threashold决定了动画变化间隔的阈值 值越大writeBlock的调用次数越少

POPAnimatableProperty其实是POP中一个比较重要的东西 像上面提到的POP自带的动画属性 查看源代码可以看到也只是POP自动帮你设置好了POPAnimatableProperty而已 其作用就是当动画的某个时间片被触发时 告诉系统如何根据当前时间片做出变化

还是以一个实际的例子来说明如何使用自定义属性 比如我们要实现一个像系统的时钟APP里秒表计时的一个效果

POPAnimatableProperty *prop = [POPAnimatableProperty
propertyWithName:@"countdown"
initializer:^(POPMutableAnimatableProperty *prop) {

prop.threshold =
100;

static int num =
0;

prop.writeBlock = ^(id obj,
const CGFloat values[]) {

UILabel *lable = (UILabel*)obj;

lable.text = [NSString
stringWithFormat:@"%d:%d:%02d",(int)values[0]/60,(int)values[0]%60,(int)(values[0]*60)%60];

NSLog(@"123--:%d",(int)values[0]);

num++;

NSLog(@"123-num-:%d",num);

};

}];

UILabel *label = [[UILabel
alloc]initWithFrame:CGRectMake(10,
300, 100,
30)];

label.backgroundColor = [UIColor
orangeColor];

label.textAlignment =
NSTextAlignmentCenter;

[self.view
addSubview:label];

POPBasicAnimation *anBasic = [POPBasicAnimation
linearAnimation];
//秒表当然必须是线性的时间函数

anBasic.property = prop;
//自定义属性

anBasic.fromValue =
@(0); //从0开始

anBasic.toValue =
@(10); //180秒

anBasic.duration =
10; //持续3分钟

anBasic.beginTime =
CACurrentMediaTime() + 1.0f;
//延迟1秒开始

[label pop_addAnimation:anBasic
forKey:@"countdown"];

其动画效果如下



有没有从中得到一些启发呢? POP可以做的事情可远比Core Animation要多(注意这里我们使用了beginTime这个属性来设置动画的延迟施放) 例如音乐播放时那种淡入淡出的效果等等也可以用POP来实现