IOS 动画基础篇

coreAnimation 框架为app提供了丰富的动画，使用简单，性能好，在后台线程生成动画帧。启用了硬件加速使动画更加流畅。在ios中动画相关类的继承关系如下：

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"];

CABasicAnimation动画

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++;
    }
}

group动画

这个动画充分利用了不同时间点上动画值的不同来实现一个提示刷新的效果。

CATransition(过渡动画)

过渡动画多用于转场，和视图切换。SDK提供一四种

kCATransitionFade
kCATransitionMoveIn 进入覆盖效果
kCATransitionPush
kCATransitionReveal 揭露离开效果
但苹果还有一些私有的动画效果。例如：
`@"cube"、@"suckEffect"、@"oglFlip"、 @"rippleEffect"、@"pageCurl"、@"pageUnCurl"、@"cameraIrisHollowOpen"、@"cameraIrisHollowClose"等。

cube

cameraIrisHollowOpen

在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 表示初始的速度，数值越大一开始移动越快。

IOS 动画基础篇

核心动画

CATransition(过渡动画)

你可能感兴趣的:(IOS 动画基础篇)