iOS中的动画

#import "ViewController.h"
#import "UITextField+Shake.h"
@interface ViewController ()
@property (retain, nonatomic) IBOutlet UIImageView *balloonImage;
@property (retain, nonatomic) IBOutlet UIButton *springBtn;

@property (retain, nonatomic) IBOutlet UITextField *shuruTF;
@property (retain, nonatomic) IBOutlet UIView *redVC;
@property (retain, nonatomic) IBOutlet UIImageView *cloudImage;

@property (retain, nonatomic) UIView *yellowView;

@end

@implementation ViewController

- (IBAction)StartBtn:(id)sender {
//[self handlePropertyAnimation]; //UIView 属性动画
//[self handlePropertyAnimationBlock]; // Block形式
//[self handleTransition]; //过度动画
//[self handleUIViewAndCALayer];
//[self handleBasicAnimation];
//[self handleKeyFrameAnimation];
//输入输入框
//[self.shuruTF shake];

//[self handleCATransition];

[self handleCAgroup];

}

- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
//    self.yellowView = [[[UIView alloc] initWithFrame:self.redVC.frame] autorelease];
//    self.yellowView.backgroundColor = [UIColor yellowColor];
//    self.yellowView.tag = 100;

}

#pragma mark -- UIView动画
//UIView 属性动画
//能够做动画的属性:frame,center,bounds,alpha,transform,backgroundColor
- (void)handlePropertyAnimation{
//iOS4.0 之前如果想做动画,必须放在开始可提交之间才有效
//对属性更改值是有效值,最终会对视图做出修改
//开始动画
[UIView beginAnimations:nil context:nil];
//1.设置动画持续时间 - s
[UIView setAnimationDuration:3];
//2.设置动画代理 --- 但是,不需要服从代理
[UIView setAnimationDelegate:self];
//3.设置代理结束之后执行的方法
[UIView setAnimationDidStopSelector:@selector(handleDidStop)];
//4.试着动画的延迟的时间 - s
//[UIView setAnimationDelay:2];
//5.设置动画从当前状态发生变化
[UIView setAnimationBeginsFromCurrentState:YES];
//6.设置动画是否反转
[UIView setAnimationRepeatAutoreverses:YES];
//7.设置动画重复次数
[UIView setAnimationRepeatCount:10];
//8.设置变化的变化曲线
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];

//center --视图位置
CGPoint center = self.redVC.center;
center.y += 10;
self.redVC.center = center;
//alpha -- 透明度
self.redVC.alpha = 0.2;
//transform -- 旋转和缩放

self.redVC.transform = CGAffineTransformRotate(self.redVC.transform, M_PI_4);

self.redVC.transform = CGAffineTransformScale(self.redVC.transform, 0.5, 0.5);

//提交
[UIView commitAnimations];
}
//动画结束后实现的方法,让视图恢复原状
- (void)handleDidStop{
//center 回到原来的位置

self.redVC.center = self.view.center;
//alpha 恢复为1.0
self.redVC.alpha = 1.0;
//transform 回到原来的位置
self.redVC.transform = CGAffineTransformIdentity;

}

//iOS4.0之后 基于Block的动画 -- (推荐)
- (void)handlePropertyAnimationBlock{

//    [UIView animateWithDuration:4 animations:^{
//        //1.最简单的block动画
//        /*
//         //对属性更改,做动画效果
//         //center --视图位置
//         CGPoint center = self.redVC.center;
//         center.y += 10;
//         self.redVC.center = center;
//         //alpha -- 透明度
//         self.redVC.alpha = 0.2;
//         //transform -- 旋转和缩放
//
//         self.redVC.transform = CGAffineTransformRotate(self.redVC.transform, M_PI_4);
//
//         self.redVC.transform = CGAffineTransformScale(self.redVC.transform, 0.5, 0.5);
//
//         */
//        //.Block 版本升级 -- 可检测动画结束时间
//        //对属性更改,做动画效果
//        //center --视图位置
//        CGPoint center = self.redVC.center;
//        center.y += 10;
//        self.redVC.center = center;
//        //alpha -- 透明度
//        self.redVC.alpha = 0.2;
//        //transform -- 旋转和缩放
//
//        self.redVC.transform = CGAffineTransformRotate(self.redVC.transform, M_PI_4);
//
//        self.redVC.transform = CGAffineTransformScale(self.redVC.transform, 0.5, 0.5);
//
//
//   } completion:^(BOOL finished) {
//       [self handleDidStop];
//   }];

//Block 形式 加强版 -- 不光可以捕获动画结束时间,而且可以配置多个参数
//    [UIView animateWithDuration:4 delay:2 options:UIViewAnimationOptionAutoreverse animations:^{
//        CGPoint center = self.redVC.center;
//        center.y += 10;
//        self.redVC.center = center;
//        //alpha -- 透明度
//        self.redVC.alpha = 0.2;
//        //transform -- 旋转和缩放
//
//        self.redVC.transform = CGAffineTransformRotate(self.redVC.transform, M_PI_4);
//
//        self.redVC.transform = CGAffineTransformScale(self.redVC.transform, 0.5, 0.5);
//
//
//    } completion:^(BOOL finished) {
//        [self handleDidStop];
//    }];
//4.弹簧效果
//1:持续时间,2.延迟时间,3.弹簧强度,4.开始变化速度,5.动画效果参数6.动画代码,7.结束动画
[UIView animateWithDuration:8 delay:0 usingSpringWithDamping:0.001 initialSpringVelocity:3 options:UIViewAnimationOptionCurveEaseInOut animations:^{
CGPoint center = self.redVC.center;
center.y += 10;
self.redVC.center = center;
//alpha -- 透明度
self.redVC.alpha = 0.8;
//transform -- 旋转和缩放

// self.redVC.transform = CGAffineTransformRotate(self.redVC.transform, M_PI);

self.redVC.transform = CGAffineTransformScale(self.redVC.transform, 1.5, 1.5);

} completion:^(BOOL finished) {
[self handleDidStop];
}];

}

//过渡动画 -- 界面间的过渡
- (void)handleTransition{
//1.只产生变化效果,但是界面没有切换
/*
[UIView transitionWithView:self.redVC duration:3 options:UIViewAnimationOptionCurveEaseInOut animations:^{
//旋转
self.redVC.transform = CGAffineTransformRotate(self.redVC.transform, M_PI_4); // M_PI_4 旋转45 M_PI_2 旋转90 M_PI 旋转180度
} completion:^(BOOL finished) {
//[self handleDidStop];
}];
*/
//2.从一个视图,切换到另一个视图
[UIView transitionFromView:self.redVC toView:self.yellowView duration:3 options:UIViewAnimationOptionTransitionCurlDown completion:^(BOOL finished) {
UIView *tempView= [self.redVC retain];
self.redVC = self.yellowView;
self.yellowView = tempView;
[tempView release];

}];

}

#pragma mark -- UIView与 CALayer
//UIView 与CALayer 的区别
//UIView 其实是CALayer 层的简单封装,真正来绘制显示内容的还是CALayer,每一个视图对象都有一个Layer属性可以访问到自己的layer层.UIView只是封装了常用属性,不常用的属性还是要设置CALayer.
- (void)handleUIViewAndCALayer{
//1.设置视图边框的宽度
self.redVC.layer.borderWidth = 2;
//2.设置视图边框的颜色
self.redVC.layer.borderColor = [UIColor whiteColor].CGColor;
//3.设置视图的圆角
self.redVC.layer.cornerRadius = 10;
//4.超出
self.redVC.layer.masksToBounds = YES;
//5.设置视图的锚点 -- 旋转的基准点  (锚点和旋转的基准点相同是,才会按设定的点转)
self.redVC.layer.anchorPoint = CGPointMake(1, 1);
// CGRect frame = self.redVC.frame;
//CGRectGetMinX  --- 获取一个视图的最小x
//CGRectGetMinY --- 获取一个视图最小的y
//CGRectGetMaxX -- 获取一个视图最大的x
//CGRectGetMaxY -- 获取一个视图最大的y
//self.redVC.layer.position = CGPointMake(CGRectGetMaxX(frame), CGRectGetMaxY(frame));
self.redVC.layer.position = CGPointMake((89+142), (215+138));
self.redVC.transform = CGAffineTransformRotate(self.redVC.transform, M_PI_4);

}

#pragma mark -- CALayer 动画

//CA属性动画 -- 基本属性动画
//CA动画修改属性值,最终不会作用到视图
//CAAnimation 基类
- (void)handleBasicAnimation{
/*
CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"opacity"];
//变化开始值
basic.fromValue = @(1.0);
//变化结束值
basic.toValue = @(0.2);
//添加到视图的 layer 层
[self.redVC.layer addAnimation:basic forKey:nil];
*/

//让云动起来
CABasicAnimation *basic = [CABasicAnimation animationWithKeyPath:@"position.x"];
//变化的开始值
basic.fromValue = @(self.cloudImage.center.x);
//变化的结束值
basic.toValue = @([UIScreen mainScreen].bounds.size.width + CGRectGetWidth(self.cloudImage.frame) / 2);
basic.duration = 10;
basic.repeatCount = 100;

//添加的视图的layer层
[self.cloudImage.layer addAnimation:basic forKey:nil];
//    NSLog(@"%f",self.cloudImage.frame.size.width);
//    if (self.cloudImage.frame.size.width > ((89+142) / 2)) {
//        [self handlePropertyAnimationBlock];
//    }
}

//CA属性动画 -- 关键帧动画
-(void)handleKeyFrameAnimation{
CAKeyframeAnimation *keyFrame = [CAKeyframeAnimation animationWithKeyPath:@"position"];

CGPoint point1 = self.cloudImage.center;
CGPoint point2 = CGPointMake([UIScreen mainScreen].bounds.size.width /2, 60);
CGPoint point3 = CGPointMake([UIScreen mainScreen].bounds.size.width, self.cloudImage.center.y);

NSValue *value1 = [NSValue valueWithCGPoint:point1];
NSValue *value2 = [NSValue valueWithCGPoint:point2];
NSValue *value3 = [NSValue valueWithCGPoint:point3];

keyFrame.values = @[value1,value2,value3,value1];
//添加到视图layer层
keyFrame.duration = 10;
keyFrame.repeatCount = 100;
[self.cloudImage.layer addAnimation:keyFrame forKey:nil];
}

/* 过渡效果
fade     //交叉淡化过渡(不支持过渡方向) kCATransitionFade
push     //新视图把旧视图推出去  kCATransitionPush
moveIn   //新视图移到旧视图上面   kCATransitionMoveIn
reveal   //将旧视图移开,显示下面的新视图  kCATransitionReveal
cube     //立方体翻滚效果
oglFlip  //上下左右翻转效果
suckEffect   //收缩效果，如一块布被抽走(不支持过渡方向)
rippleEffect //滴水效果(不支持过渡方向)
pageCurl     //向上翻页效果
pageUnCurl   //向下翻页效果
cameraIrisHollowOpen  //相机镜头打开效果(不支持过渡方向)
cameraIrisHollowClose //相机镜头关上效果(不支持过渡方向)
*/

/* 过渡方向
kCATransitionFromRight
kCATransitionFromLeft
kCATransitionFromBottom
*/
//CA过渡动画
- (void)handleCATransition{
CATransition *transition = [CATransition animation];
//配置过度动画类型
transition.type = @"cube";
//transition.duration = 100;
//配置过度动画方向
//transition.subtype = kCATransitionFromLeft;
//添加视图layer层
[self.redVC.layer addAnimation:transition forKey:nil];
}

//CA 分组动画

- (void)handleCAgroup{

//1.关键帧动画 -- 沿圆形轨迹移动
CAKeyframeAnimation *keyFrame1 = [CAKeyframeAnimation animationWithKeyPath:@"position"];
CGFloat y = [UIScreen mainScreen].bounds.size.width;

UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(0, y) radius:y startAngle:-M_PI_2 endAngle:M_PI_2 clockwise:YES];

//关键帧动画给上圆形轨迹
keyFrame1.path = path.CGPath; //让贝塞尔曲线作为移动轨迹
keyFrame1.duration = 10;

//2.关键帧动画 -- 气球放大缩小

CAKeyframeAnimation *keyFrame2 = [CAKeyframeAnimation animationWithKeyPath:@"transform.scale"];
keyFrame2.values = @[@(1.0),@(1.2),@(1.4),@(1.6),@(1.8),@(2.0),@(1.8),@(1.6),@(1.4),@(1.2),@(1.0)];
keyFrame2.duration = 10;

//3.创建分组
CAAnimationGroup *group= [CAAnimationGroup animation];
group.animations = @[keyFrame2,keyFrame1];
group.duration = 1000;
[self.balloonImage.layer addAnimation:group forKey:nil];

}

- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

- (void)dealloc {
self.yellowView = nil;
[_shuruTF release];
[_redVC release];
[_cloudImage release];
[_balloonImage release];
[_springBtn release];
[super dealloc];
}
@end

UITextField+Shake.h

#import <UIKit/UIKit.h>

@interface UITextField (Shake)
//抖动
- (void)shake;
@end

#import "UITextField+Shake.h"

@implementation UITextField (Shake)
//抖动
- (void)shake{
CAKeyframeAnimation *keyFrame = [CAKeyframeAnimation animationWithKeyPath:@"position.x"];
keyFrame.values = @[@(self.layer.position.x - 10), @(self.layer.position.x),@(self.layer.position.x + 10),@(self.layer.position.x)];
//设置重复次数
keyFrame.repeatCount = 7;
//持续时间
keyFrame.duration = 0.1;
//添加到视图的layer层
[self.layer addAnimation:keyFrame forKey:nil];
}
@end