iOS 一些CAAnimation、CATransition基础动画实现

这篇文章意在做一些简单的Animation Category 方便需初学者使用和有兴趣间接去了解一下CALayer Core Animation 看到网上很多博文都写的很好 有兴趣可以多了解一下 都不是很难 主要是一些API的理解和调试运用 理解了就很简单了
iOS核心动画
Demo写了三个类别 分别是在项目中有使用的一些简单动画实现(呼吸、心跳、绕轴XYZ旋转、系统支持的一些水波纹、翻书、立方、翻转等...)

关于Core Animation完整的详细资料,这里有一份详细的介绍(由海水的味道翻译)

图层是Core Animation的核心,那么什么是CALayer

OC中,基本上所有的控件都是UIView,而UIView之所以能够在屏幕上显示,因为每一个UIView内部都默认关联一个CALayer.
当UIView将要显示到屏幕上的时候,会调用drawRect:进行绘图,将所有的内容绘制在自己的图层上,绘制完毕后,系统会将图层copy到屏幕上.其实也就是说UIView本身不具备显示的功能,是因为有了Layer才有显示的功能,所以UIView和CALayer相互依赖.
CALayer 基础介绍

一些动画简单的使用例子 具体可以看文末demo

/** 心跳缩放动画*/
- (void)beginHeartbeatAnimation{
    
    CABasicAnimation *opacityAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale.xy"];
    opacityAnimation.fromValue = @0.8;
    opacityAnimation.toValue = @1.2;
    opacityAnimation.duration = 0.5;
    opacityAnimation.autoreverses = YES;
    opacityAnimation.repeatCount = INFINITY;
    opacityAnimation.fillMode = kCAFillModeBoth;
    opacityAnimation.removedOnCompletion = NO;
    [self addAnimation:opacityAnimation forKey:@"beginHeartbeatAnimation"];
}

- (void)removeHeartbeatAnimation{
    [self removeAnimationForKey:@"beginHeartbeatAnimation"];
}
iOS 一些CAAnimation、CATransition基础动画实现_第1张图片
跳动.gif
/**
 翻转动画

 @param direction 方向
 @param duration 时间
 @param isReverse 自动反转
 @param repeatCount 重复次数
 */
-(CAAnimation *)reversAnimationWithDirection:(AnimReverDirection)direction
                                    duration:(NSTimeInterval)duration
                                   isReverse:(BOOL)isReverse
                                 repeatCount:(NSUInteger)repeatCount
                              timingFuncName:(NSString *)timingFuncName{
    
    NSString *key = @"reversAnim";
    
    if([self animationForKey:key]!=nil){
        [self removeAnimationForKey:key];
    }
    
    NSString *directionStr = nil;
    
    if(AnimReverDirectionX == direction)directionStr=@"x";
    if(AnimReverDirectionY == direction)directionStr=@"y";
    if(AnimReverDirectionZ == direction)directionStr=@"z";
    
    //创建普通动画
    CABasicAnimation *reversAnim = [CABasicAnimation animationWithKeyPath:[NSString stringWithFormat:@"transform.rotation.%@",directionStr]];
    
    //起点值
    reversAnim.fromValue=@(0);
    
    //终点值
    reversAnim.toValue = @(M_PI_2);
    
    //时长
    reversAnim.duration = duration;
    
    //自动反转
    reversAnim.autoreverses = isReverse;
    
    //完成删除
    reversAnim.removedOnCompletion = YES;
    
    //重复次数
    reversAnim.repeatCount = repeatCount;
    
    //添加
    [self addAnimation:reversAnim forKey:key];
    
    return reversAnim;
}
iOS 一些CAAnimation、CATransition基础动画实现_第2张图片
翻转.gif
/**
 *  转场动画
 *
 *  @param animType 转场动画类型
 *  @param subType 转动动画方向
 *  @param curve    转动动画曲线
 *  @param duration 转动动画时长
 *
 *  @return 转场动画实例
 */
-(CATransition *)transitionWithAnimType:(TransitionAnimType)animType
                                subType:(TransitionSubType)subType
                                  curve:(TransitionCurve)curve
                               duration:(CGFloat)duration;
/**
 *  转场动画
 *
 *  @param animType 转场动画类型
 *  @param subType  转动动画方向
 *  @param curve    转动动画曲线
 *  @param duration 转动动画时长
 *
 *  @return 转场动画实例
 */
-(CATransition *)transitionWithAnimType:(TransitionAnimType)animType
                                subType:(TransitionSubType)subType
                                  curve:(TransitionCurve)curve
                               duration:(CGFloat)duration{
    
    NSString *key = @"transition";
    
    if([self animationForKey:key]!=nil){
        [self removeAnimationForKey:key];
    }
    
    
    CATransition *transition=[CATransition animation];
    
    //动画时长
    transition.duration=duration;
    
    //动画类型
    transition.type=[self animaTypeWithTransitionType:animType];
    
    //动画方向
    transition.subtype=[self animaSubtype:subType];
    
    //缓动函数
    transition.timingFunction=[CAMediaTimingFunction functionWithName:[self curve:curve]];
    
    //完成动画删除
    transition.removedOnCompletion = YES;
    
    [self addAnimation:transition forKey:key];
    
    return transition;
}

/*
 *  返回动画曲线
 */
-(NSString *)curve:(TransitionCurve)curve{
    
    //曲线数组
    NSArray *funcNames=@[kCAMediaTimingFunctionDefault,
                         kCAMediaTimingFunctionEaseIn,
                         kCAMediaTimingFunctionEaseInEaseOut,
                         kCAMediaTimingFunctionEaseOut,
                         kCAMediaTimingFunctionLinear];
    
    return [self objFromArray:funcNames
                        index:curve
                     isRamdom:(TransitionCurveRamdom == curve)];
}

/*
 *  返回动画方向
 */
-(NSString *)animaSubtype:(TransitionSubType)subType{
    
    //设置转场动画的方向
    NSArray *subtypes=@[kCATransitionFromTop,
                        kCATransitionFromLeft,
                        kCATransitionFromBottom,
                        kCATransitionFromRight];
    
    return [self objFromArray:subtypes
                        index:subType
                     isRamdom:(TransitionSubtypesFromRamdom == subType)];
}

/*
 *  返回动画类型
 */
-(NSString *)animaTypeWithTransitionType:(TransitionAnimType)type{
    
    //设置转场动画的类型
    NSArray *animArray=@[@"rippleEffect",
                         @"suckEffect",
                         @"pageCurl",
                         @"oglFlip",
                         @"cube",
                         @"reveal",
                         @"pageUnCurl"];
    
    return [self objFromArray:animArray
                        index:type
                     isRamdom:(TransitionAnimTypeRamdom == type)];
}

/*
 *  统一从数据返回对象
 */
-(id)objFromArray:(NSArray *)array
            index:(NSUInteger)index
         isRamdom:(BOOL)isRamdom{
    
    NSUInteger count = array.count;
    
    NSUInteger i = isRamdom?arc4random_uniform((u_int32_t)count) : index;
    
    return array[i];
}
转场-水波纹.gif
转场-翻书.gif
转场-正方体.gif

github地址:LHAnimationDemo

你可能感兴趣的:(iOS 一些CAAnimation、CATransition基础动画实现)