coreAnimation 框架为app提供了丰富的动画,使用简单,性能好,在后台线程生成动画帧。启用了硬件加速使动画更加流畅。在ios中动画相关类的继承关系如下:
核心动画
在平常开发中使用的较多的动画类就是CABasicAnimation 和CAKeyframeAnimation 和CAAnimationGroup两者结合就可以做出很炫的动画。其中系统自带的动画如下:
transform.scale
transform.scale.x
transform.scale.y
transform.rotation.z
opacity
margin
zPosition
backgroundColor
cornerRadius
borderWidth
bounds
contents
contentsRect
cornerRadius
frame
hidden
mask
masksToBounds
opacity
position
shadowColor
shadowOffset
shadowOpacity
shadowRadius
CABasicAnimation 的属性有
@property(nullable, strong) id fromValue;
@property(nullable, strong) id toValue;
@property(nullable, strong) id byValue;
这里要解释的是toValue和byValue 。byValue 是在fromValue基础上增长多少值,而toValue是到指定的值。
CABasicAnimation *scaleAnim = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
scaleAnim.duration = 2; //动画时长
scaleAnim.fromValue = @(1); //开始值
scaleAnim.toValue = @(3); //放大3倍
scaleAnim.repeatCount = HUGE_VALF; //重复次数
scaleAnim.speed = 1.5; //速度
[scaleView.layer addAnimation:scaleAnim forKey:@"scaleAnimation"];
CAKeyframeAnimation 实现的动画比basic动画更炫。keyframe和basic 组合后生成group动画就更加丰富多彩了。现在就举个水波纹的group动画。
- (void)waveAnimation
{
CGFloat duration = 12;
NSInteger number = 0;
while (number <2 ) {
UIView *xiuView;
if (!xiuView) {
xiuView = [[UIView alloc] initWithFrame:CGRectMake(0, 0,30, 30)];
xiuView.center = self.view.center;
xiuView.layer.cornerRadius = 15;
xiuView.tag = 10000+number;
xiuView.backgroundColor = [UIColor redColor];
[self.view insertSubview:xiuView atIndex:0];
}
CAKeyframeAnimation *opKey = [CAKeyframeAnimation animationWithKeyPath:@"opacity"];
opKey.duration = duration;
CAKeyframeAnimation *scaleKey = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale"];
scaleKey.duration = duration;
//重复3次
opKey.values = @[@.4,@0,@.4,@0,@.4,@0,@0];
opKey.keyTimes = @[@0,@.16,@.16,@.33,@.33,@.5,@.5,@1];
scaleKey.values = @[@1,@6,@1,@6,@1,@6,@1,@1];
scaleKey.keyTimes = @[@0,@.16,@.16,@.33,@.33,@.5,@.5,@1];
CAAnimationGroup *group = [[CAAnimationGroup alloc] init];
group.animations = @[opKey,scaleKey];
group.repeatCount = HUGE_VALF;
group.duration = 12;
group.beginTime = CACurrentMediaTime()+number*1;
[xiuView.layer addAnimation:group forKey:@"waveAnimationKey"];
number++;
}
}
这个动画充分利用了不同时间点上动画值的不同来实现一个提示刷新的效果。
CATransition(过渡动画)
过渡动画多用于转场,和视图切换。SDK提供一四种
- kCATransitionFade
- kCATransitionMoveIn 进入覆盖效果
- kCATransitionPush
- kCATransitionReveal 揭露离开效果
但苹果还有一些私有的动画 效果。例如:
`@"cube"、@"suckEffect"、@"oglFlip"、 @"rippleEffect"、@"pageCurl"、@"pageUnCurl"、@"cameraIrisHollowOpen"、@"cameraIrisHollowClose"等。
在ios9以上,苹果又增加了CASpringAnimation,这是弹簧动画。
质量(mass) 对象质量 质量越大 弹性越大 需要的动画时间越长 默认是1 必须大于0
刚度系数(stiffness ) 刚度系数越大,产生形变的力就越大,运动越快。默认是100
阻尼系数(damping ) 阻止弹簧伸缩的系数 阻尼系数越大,停止越快。时间越短 默认是10
初始速度(initialVelocity ) 正负代表方向,数值代表大小 默认是0
UIView 封装了一个弹簧动画
[UIView animateWithDuration: delay: usingSpringWithDamping: initialSpringVelocity: options:animations:^{
} completion:^(BOOL finished) {
}];
这里的 usingSpringWithDamping
的范围是0-1.0f 数值越小「弹簧」的振动效果越明显。initialSpringVelocity
表示初始的速度,数值越大一开始移动越快。