zoukankan      html  css  js  c++  java
  • 猫猫学IOS(四十)UI之核心动画_抖动效果_CAKeyframeAnimation

    猫猫分享,必须精品

    原创文章,欢迎转载。转载请注明:翟乃玉的博客
    地址:http://blog.csdn.net/u013357243?viewmode=contents

    效果:

    效果一:
    这里写图片描述
    效果二:

    这里写图片描述

    代码:

    //
    //  NYViewController.m
    //  图片抖动
    //
    //  Created by apple on 15-5-8.
    //  Copyright (c) 2015年 znycat. All rights reserved.
    //
    
    #import "NYViewController.h"
    
    @interface NYViewController ()
    
    @property (nonatomic, weak) UIImageView *iconView;
    
    @end
    
    @implementation NYViewController
    
    -(UIImageView *)iconView
    {
        if (_iconView == nil) {
            UIImageView *iconView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"cat"]];
    
            iconView.center = CGPointMake(100, 230);
            [self.view addSubview:iconView];
            _iconView = iconView;
            return _iconView;
        }
        return _iconView;
    }
    
    - (void)viewDidLoad
    {
        [super viewDidLoad];
        [self iconView];
    
    }
    
    //开始抖动
    -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
    {
    
        [self position];
        [self rotation];
    
    }
    
    //关键帧动画移动
    - (void)position {
        // 1.创建核心动画
        CAKeyframeAnimation *keyAnima = [CAKeyframeAnimation animation];
        // 1.1告诉系统执行什么动画
        keyAnima.keyPath = @"position";
        //    NSValue *v1 = [NSValue valueWithCGPoint:CGPointMake(0, 100)];
        NSValue *v1 = [NSValue valueWithCGPoint:CGPointMake(100, 100)];
        NSValue *v2 = [NSValue valueWithCGPoint:CGPointMake(250, 100)];
        NSValue *v3 = [NSValue valueWithCGPoint:CGPointMake(250, 300)];
        NSValue *v4 = [NSValue valueWithCGPoint:CGPointMake(100, 300)];
        NSValue *v5 = [NSValue valueWithCGPoint:CGPointMake(100, 100)];
    
        keyAnima.values = @[v1, v2, v3, v4, v5];
    
        //    keyAnima.keyTimes = @[@(0.5) ,@(0.5), @(0.5)];
    
        keyAnima.timingFunction =  [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    
        // 1.2保存执行完之后的状态
        // 1.2.1执行完之后不删除动画
        keyAnima.removedOnCompletion = NO;
        // 1.2.2执行完之后保存最新的状态
        keyAnima.fillMode = kCAFillModeForwards;
    
        // 1.3设置动画时间
        keyAnima.duration = 2;
    
        // 2.观察动画什么时候开始执行, 以及什么时候执行完毕
        keyAnima.delegate = self;
    
    
        // 2.添加核心动画
        [self.iconView.layer addAnimation:keyAnima forKey:nil];
    }
    
    
    //动画抖动效果rotation
    - (void)rotation {
        //1,创建核心动画
        CAKeyframeAnimation *keyAnima = [CAKeyframeAnimation animation];
    
        //2,告诉系统执行什么动画。
        keyAnima.keyPath = @"transform.rotation";
    
        //              (-M_PI_4 /90.0 * 5)表示-5度 。
        keyAnima.values = @[@(-M_PI_4 /90.0 * 5),@(M_PI_4 /90.0 * 5),@(-M_PI_4 /90.0 * 5)];
    
        // 1.2.1执行完之后不删除动画
        keyAnima.removedOnCompletion = NO;
        // 1.2.2执行完之后保存最新的状态
        keyAnima.fillMode = kCAFillModeForwards;
    
        //动画执行时间
        keyAnima.duration = 0.2;
    
        //设置重复次数。
        keyAnima.repeatCount = MAXFLOAT;
    
        // 2.添加核心动画
        [self.iconView.layer addAnimation:keyAnima forKey:nil];
    }
    
    
    
    
    
    
    @end
    

    CAKeyframeAnimation帧动画介绍

    CApropertyAnimation的子类,跟CABasicAnimation的区别是:CABasicAnimation只能从一个数值(fromValue)变到另一个数值(toValue),而CAKeyframeAnimation会使用一个NSArray保存这些数值

    属性解析:

    values:就是上述的NSArray对象。里面的元素称为”关键帧”(keyframe)。动画对象会在指定的时间(duration)内,依次显示values数组中的每一个关键帧
    path:可以设置一个CGPathRefCGMutablePathRef,让层跟着路径移动。path只对CALayer的anchorPoint和position起作用。如果你设置了path,那么values将被忽略
    keyTimes:可以为对应的关键帧指定对应的时间点,其取值范围为0到1.0,keyTimes中的每一个时间值都对应values中的每一帧.当keyTimes没有设置的时候,各个关键帧的时间是平分的
    CABasicAnimation可看做是最多只有2个关键帧的CAKeyframeAnimation

    用法步骤:

    1.创建核心动画

        CAKeyframeAnimation *keyAnima = [CAKeyframeAnimation animation];

    1.1告诉系统执行什么动画

     keyAnima.keyPath = @"position";
    
        NSValue *v1 = [NSValue valueWithCGPoint:CGPointMake(100, 100)];
        NSValue *v2 = [NSValue valueWithCGPoint:CGPointMake(250, 100)];
        NSValue *v3 = [NSValue valueWithCGPoint:CGPointMake(250, 300)];
        NSValue *v4 = [NSValue valueWithCGPoint:CGPointMake(100, 300)];
        NSValue *v5 = [NSValue valueWithCGPoint:CGPointMake(100, 100)];
    
        keyAnima.values = @[v1, v2, v3, v4, v5];
    
        keyAnima.timingFunction =  [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    

    1.2保存执行完之后的状态
    1.2.1执行完之后不删除动画

    keyAnima.removedOnCompletion = NO;

    1.2.2执行完之后保存最新的状态

      keyAnima.fillMode = kCAFillModeForwards;

    1.3设置动画时间

     keyAnima.duration = 2;

    2.观察动画什么时候开始执行, 以及什么时候执行完毕

     keyAnima.delegate = self;

    2.添加核心动画到CALayer

    [self.iconView.layer addAnimation:keyAnima forKey:nil];
  • 相关阅读:
    linux查看python安装位置
    Linux 重命名
    Linux 解压 压缩文件
    linux下文件的复制、移动与删除
    设计模式-命令模式
    设计模式-心得
    设计模式-责任链模式
    ajax跨域问题以及解决方案
    强者运强
    管理者法则
  • 原文地址:https://www.cnblogs.com/znycat/p/4521008.html
Copyright © 2011-2022 走看看