iOS讲解迷惑深入浅出之基础动画-关键帧动画

来源：互联网发布：java xe hystrix 编辑：程序博客网时间：2024/05/22 13:16
/  Copyright (c) 2015年 nieyinlong. All rights reserved.//#import "RootViewController.h"@interface RootViewController ()// myView 赋值重名@property (nonatomic, retain) UIView *myView;@end@implementation RootViewController- (void)dealloc{    [_myView release];    [super dealloc];}- (void)viewDidLoad {    [super viewDidLoad];    // Do any additional setup after loading the view.    [self addSubViews];        self.navigationItem.title = @"CALayer";}- (void)addSubViews{    self.view.backgroundColor = [UIColor blackColor];        self.myView = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 200, 200)];    self.myView.backgroundColor = [UIColor yellowColor];    [self.view addSubview:self.myView];    [_myView release];    //     UIImageView *imageV = [[UIImageView alloc] init];//    imageV.transform.r        // layer 是负责显示图层的    // 要更改咱们看到的图形形状, 需要更改layer            // 设置圆角    // 矩形变成圆形的前提条件: 矩形必须为正方形    self.myView.layer.cornerRadius = self.myView.frame.size.width / 2;        // 设置阴影的颜色    // CGColorRef 图层绘制的颜色    self.myView.layer.shadowColor = [UIColor redColor].CGColor;        // 阴影的显示范围    self.myView.layer.shadowOffset = CGSizeMake(10, 10);        // 阴影的透明度(1是不透明), 不写透明度不会显示阴影, 因为默认透明    self.myView.layer.shadowOpacity = 1;        // 阴影的模糊程度    self.myView.layer.shadowRadius = 40;        // 设置边框的宽度    self.myView.layer.borderWidth = 20;        // 边框颜色    self.myView.layer.borderColor = [UIColor purpleColor].CGColor;            UIButton *button  = [UIButton buttonWithType:(UIButtonTypeCustom)];    button.frame = CGRectMake(20, 500, 100, 40);    button.backgroundColor = [UIColor redColor];    [button setTitle:@"沿X旋转" forState:(UIControlStateNormal)];    [button addTarget:self action:@selector(actionBtn:) forControlEvents:(UIControlEventTouchUpInside)];    [self.view addSubview:button];            UIButton *button2  = [UIButton buttonWithType:(UIButtonTypeCustom)];    button2.frame = CGRectMake(20, 560, 100, 40);    button2.backgroundColor = [UIColor redColor];    [button2 setTitle:@"改变size" forState:(UIControlStateNormal)];    [button2 addTarget:self action:@selector(actionBtnSize:) forControlEvents:(UIControlEventTouchUpInside)];    [self.view addSubview:button2];            UIButton *button3  = [UIButton buttonWithType:(UIButtonTypeCustom)];    button3.frame = CGRectMake(200, 500, 120, 40);    button3.backgroundColor = [UIColor redColor];    [button3 setTitle:@"改变背景颜色" forState:(UIControlStateNormal)];    [button3 addTarget:self action:@selector(actionBtnColor:) forControlEvents:(UIControlEventTouchUpInside)];    [self.view addSubview:button3];            UIButton *button4  = [UIButton buttonWithType:(UIButtonTypeCustom)];    button4.frame = CGRectMake(200, 560, 120, 40);    button4.backgroundColor = [UIColor redColor];    [button4 setTitle:@"轨迹移动" forState:(UIControlStateNormal)];    [button4 addTarget:self action:@selector(actionBtnXX:) forControlEvents:(UIControlEventTouchUpInside)];    [self.view addSubview:button4];                    UIButton *button5  = [UIButton buttonWithType:(UIButtonTypeCustom)];    button5.frame = CGRectMake(20, 630, 80, 30);    button5.backgroundColor = [UIColor redColor];    [button5 setTitle:@"晃动" forState:(UIControlStateNormal)];    [button5 addTarget:self action:@selector(actionBtnHuangDong:) forControlEvents:(UIControlEventTouchUpInside)];    [self.view addSubview:button5];                    UIButton *button6  = [UIButton buttonWithType:(UIButtonTypeCustom)];    button6.frame = CGRectMake(150, 630, 80, 30);    button6.backgroundColor = [UIColor redColor];    [button6 setTitle:@"3D旋转" forState:(UIControlStateNormal)];    [button6 addTarget:self action:@selector(actionBtnXuanZhuan:) forControlEvents:(UIControlEventTouchUpInside)];    [self.view addSubview:button6];            UIButton *button7  = [UIButton buttonWithType:(UIButtonTypeCustom)];    button7.frame = CGRectMake(250, 630, 80, 30);    button7.backgroundColor = [UIColor redColor];    [button7 setTitle:@"组动画" forState:(UIControlStateNormal)];    [button7 addTarget:self action:@selector(actionBtnGroup:) forControlEvents:(UIControlEventTouchUpInside)];    [self.view addSubview:button7];            // layer层动画        // CAPropertyAnimation 抽象类, 下面的两个类是其子类    // CABasicAnimation    基础动画(更改大小, 旋转等)    // CAKeyframeAnimation 主要按轨迹移动位置等, 例如执行一组动画时使用}#pragma mark - 点击按钮调用旋转方法- (void)actionBtn:(UIButton *)btn{    [self XYAnimation];    }- (void)actionBtnSize:(UIButton *)btn{    [self sizeAnimation];}- (void)actionBtnColor:(UIButton *)btn{    [self changeBackgroundColor];}- (void)actionBtnXX:(UIButton *)btn{    [self posiontPoint];}- (void)actionBtnHuangDong:(UIButton *)btn{    NSLog(@"晃动");    [self huangDong];}- (void)actionBtnXuanZhuan:(UIButton *)btn{    NSLog(@"#3D");    [self transform3D];}- (void)actionBtnGroup:(UIButton *)btn{    NSLog(@"组动画");    [self groupAnimation];}#pragma mark -  沿着X/Y旋转- (void)XYAnimation{    // 新建一个基础动画    // 参数: 填一个属性  animationWithKeyPath:<#(NSString *)#>  (KeyPath: 间接访问属性, 千万不能写错)    // 咱们要更改的是transform.rotation.x 形变属性下 弧度的 X 轴, 沿X轴旋转    // KeyPath 就是CALayer中可以做动画的属性    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"];        // rotation 代表旋转的弧度      // 设置属性变化到某一个值    // toValue 需要一个对象类型, 即 NSNumber 或 NSValue (用NSNumber 或NSValue 转成对象类型)    animation.toValue = [NSNumber numberWithFloat:M_PI * 2]; // M_PI * 2就是 PI*1 转2圈        // 设置动画时间    animation.duration = 1;        // 设置动画 重复次数    animation.repeatCount = 1;        // 把设置好的动画加到layer上    // 参数二: 添加到动画的标识 (名字自己起)    [self.myView.layer addAnimation:animation forKey:@"transform.rotation.x"]; // forKey:@"" 随便起名}#pragma mark ---- 改变size的动画- (void)sizeAnimation{    // 更改大小的话, 需要更改 bounds.size    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"bounds.size"];    // 从 (200, 200) 更改到 (40, 400) 然后恢复到原来大小        // 设置改变的值 (初始值)    animation.fromValue = [NSValue valueWithCGSize:CGSizeMake(200, 200)];    // 结束值    animation.toValue = [NSValue valueWithCGSize:CGSizeMake(40, 400)];    // 动画播放时间    animation.duration = 1;        // 加到layer上    [self.myView.layer addAnimation:animation forKey:@"Bound"];}#pragma mark--  CAKeyframeAnimation 改变背景颜色  ---- (void)changeBackgroundColor{        CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];         CGColorRef color1 = [UIColor redColor].CGColor;    CGColorRef color2 = [UIColor greenColor].CGColor;    CGColorRef color3 = [UIColor yellowColor].CGColor;        animation.values = @[(id)color1, (id)color2, (id)color3];        animation.duration = 1;        [self.myView.layer addAnimation:animation forKey:nil];}#pragma mark - 轨迹移动- (void)posiontPoint{    // 把一个点转换成CGPoint类型    NSLog(@"%@", NSStringFromCGPoint(self.myView.layer.position));        // 创建对象    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];        // 创建一堆点    NSValue *point1 = [NSValue valueWithCGPoint:CGPointMake(0, 444)];    NSValue *point2 = [NSValue valueWithCGPoint:CGPointMake(444, 0)];    NSValue *point3 = [NSValue valueWithCGPoint:CGPointMake(0, 444)];    NSValue *point4 = [NSValue valueWithCGPoint:CGPointMake(444, 0)];        // 往数组添加点    animation.values = @[point1, point2, point3, point4];        // 设置时间    animation.duration = 1;        // 加到layer上面    [self.myView.layer addAnimation:animation forKey:@"POSITION"];        }#pragma mark - 晃动- (void)huangDong{    NSLog(@"000000");        CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position.x"];        CGFloat center = self.myView.center.x;    CGFloat left = center - 10;    CGFloat right = center + 10;            NSNumber *l= [NSNumber numberWithFloat:left];    NSNumber *cen = [NSNumber numberWithFloat:center];    NSNumber *r = [NSNumber numberWithFloat:right];        animation.values = @[l, cen, r,l, cen, r,l, cen, r,l, cen, r];    animation.duration = 1;    [self.myView.layer addAnimation:animation forKey:@"傻逼"];}#pragma mark - 3D旋转- (void)transform3D{    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];    // 改变结束值    // 参数2: 弧度    animation.toValue = [NSValue valueWithCATransform3D:CATransform3DRotate(self.myView.layer.transform, M_PI, 200, 200, 200)];            animation.duration = 1;        [self.myView.layer addAnimation:animation forKey:@"transtion"];}#pragma mark--- 组动画(播放一组动画)- (void)groupAnimation{        // 创建组动画    CAAnimationGroup * animationGroup = [CAAnimationGroup animation];        // 设置组动画时间    animationGroup.duration = 3;        // 设置组动画执行的动画数组    // 把一个点转换成CGPoint类型    NSLog(@"%@", NSStringFromCGPoint(self.myView.layer.position));                        // 第一组动画.    创建对象    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];        // 创建一堆点    NSValue *point1 = [NSValue valueWithCGPoint:CGPointMake(0, 444)];    NSValue *point2 = [NSValue valueWithCGPoint:CGPointMake(444, 0)];    NSValue *point3 = [NSValue valueWithCGPoint:CGPointMake(0, 444)];    NSValue *point4 = [NSValue valueWithCGPoint:CGPointMake(444, 0)];        // 往数组添加点    animation.values = @[point1, point2, point3, point4];        // 设置时间    animation.duration = 1;        // 加到layer上面    [self.myView.layer addAnimation:animation forKey:@"POSITION"];        //----            // 2. 新建一个基础动画    // 参数: 填一个属性  animationWithKeyPath:<#(NSString *)#>  (KeyPath: 间接访问属性, 千万不能写错)    // 咱们要更改的是transform.rotation.x 形变属性下 弧度的 X 轴, 沿X轴旋转    CABasicAnimation *animationBasic = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"];        // 设置属性变化到某一个值    // toValue 需要一个对象类型, 即 NSNumber 或 NSValue    animationBasic.toValue = [NSNumber numberWithFloat:M_PI * 20]; // M_PI * 2就是 PI*1 转2圈        // 设置动画时间    animationBasic.duration = 1;        // 设置动画 重复次数    animationBasic.repeatCount = 1;        // 把设置好的动画加到layer上    // 参数二: 添加到动画的标识 (名字自己起)    [self.myView.layer addAnimation:animationBasic forKey:@"transform.rotation.x"]; // forKey:@"" 随便起名                        animationGroup.animations = @[animation, animationBasic];    [self.myView.layer addAnimation:animationGroup forKey:@"group"];    }
0 0