码迷,mamicode.com
首页 > 其他好文 > 详细

转场动画CALayer (Transition)

时间:2018-09-05 23:44:51      阅读:167      评论:0      收藏:0      [点我收藏+]

标签:nta   remove   integer   随机   接口   曲线   from   curl   rev   

1、将对应UI控件的层调用以下接口即可

  • 1.1 .h文件

    //
    // 文 件 名:CALayer+Transition.h
    // 
    // 版权所有:Copyright ? 2018年 leLight. All rights reserved.
    // 创 建 者:leLight 
    // 创建日期:2018/7/6.
    // 文档说明:
    // 修 改 人:
    // 修改日期:
    // 
    
    #import <QuartzCore/QuartzCore.h>
    
    @interface CALayer (Transition)
    
    /************ 动画类型 *****************************/
    typedef enum {
    
        TransitionAnimTypeRippleEffect=0, // 水波
        TransitionAnimTypeSuckEffect,     // 吸走
        TransitionAnimTypePageCurl,       // 翻开书本
        TransitionAnimTypeOglFlip,        // 正反翻转
        TransitionAnimTypeCube,           // 正方体
        TransitionAnimTypeReveal,         // push推开
        TransitionAnimTypePageUnCurl,     // 合上书本
        TransitionAnimTypeRamdom,         // 随机
    } TransitionAnimType;
    
    /************ 动画方向 *****************************/
    typedef enum {
    
        TransitionSubtypesFromTop=0,  // 从上
        TransitionSubtypesFromLeft,   // 从左
        TransitionSubtypesFromBotoom, // 从下
        TransitionSubtypesFromRight,  // 从右
        TransitionSubtypesFromRamdom, // 随机
    } TransitionSubType;
    
    /************ 动画曲线 *****************************/
    typedef enum {
    
        TransitionCurveDefault,       // 默认
        TransitionCurveEaseIn,        // 缓进
        TransitionCurveEaseOut,       // 缓出
        TransitionCurveEaseInEaseOut, // 缓进缓出
        TransitionCurveLinear,        // 线性
        TransitionCurveRamdom,        // 随机
    } TransitionCurve;
    
    /**
     *  转场动画
     *
     *  @param animType 转场动画类型
     *  @param subType  转动动画方向
     *  @param curve    转动动画曲线
     *  @param duration 转动动画时长
     *
     *  @return 转场动画实例
     */
    - (CATransition *)transitionWithAnimType:(TransitionAnimType)animType subType:(TransitionSubType)subType curve:(TransitionCurve)curve duration:(CGFloat)duration;
    
    @end
  • 1.2 .m文件

    //
    // 文 件 名:CALayer+Transition.m
    // 
    // 版权所有:Copyright ? 2018年 leLight. All rights reserved.
    // 创 建 者:leLight 
    // 创建日期:2018/7/6.
    // 文档说明:
    // 修 改 人:
    // 修改日期:
    // 
    
    #import "CALayer+Transition.h"
    
    @implementation CALayer (Transition)
    
    /**
     *  转场动画
     *
     *  @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",
                             @"push"
                             ];
        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];
    }
    
    @end

转场动画CALayer (Transition)

标签:nta   remove   integer   随机   接口   曲线   from   curl   rev   

原文地址:https://www.cnblogs.com/CH520/p/9593904.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!