猫猫学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:可以设置一个CGPathRef\CGMutablePathRef,让层跟着路径移动。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];