进击 的KFC:UI(12)动画

#pragma mark --- UIVIew动画
 // UIVIew动画
    // 动画特点:全部都是类方法 直接类去调用
    // 1.UIVIew 直接调用
    // 2.block方法
// 1.UIVIew 直接调用 步骤:
 1.开始动画
     // 参数1:标识动画的字符,动画的ID
     // 参数2:携带参数
  [UIView beginAnimation:@“animation”context
:@“hahah"];
 2.——之间写你要执行的动画 (setAnimation….)
   // 设置动画执行的时间
[UIView setAnimationDuration:1];
   // 设置延迟
[UIView setAnimationDelay:1];
  // 设置是否反转动画 (View还能回到原来的状态)
[UIView setAnimationRepeatAutoreverses:YES];
   // 执行的次数 (CGFLOAT_MAX表示无限次)
[UIView setAnimationRepeat];
   // 是否继续执行
[UIView setAnimationBeginsFromCurrentState:YES];
  // 设置代理 (假代理,需要自己设置代理方法)
[UIView setAnimationDelegate:self];
  // 需要自己设置的代理方法
 [UIView setAnimationWillStartSelector:@selector(animationWillStart:context:)];
  // 动画结束后要做的
[UIView setAnimationDidStopSelector:@selector(animationDidStop)];
 // 改变位置
self.oldFrame = self.myView.frame;
self.oldColor = self.myView.backgroundColor;
self.oldAplha = self.myView.alpha;
self.myView.frame = CGRectMake(0, 0, 100, 100);
 // 修改颜色
self.myView.backgroundColor = [UIColor redColor];
 // 修改透明的
 self.myView.alpha = 0.2;
  //3.提交动画
  [UIView commitAnimations];

#pragma mark --- UIVIew 的block动画
// 2. UIVIew 的 block方法
// 2D仿射
// 格式写法:
   [UIView animateWithDuration:1 animations:^{
        // 你要执行的动画
        // 改变的是视图的形变属性 : transform
pragma mark --- 平移
        self.myView.transform = CGAffineTransformTranslate(self.myView.transform, 100, 100);

    } completion:^(BOOL finished) {

       // 动画结束后执行的block,回到原来的位置

      // 通过block里面再嵌套一个动画block,可以让 回去 也能是动画效果
        [UIView animateWithDuration:2 animations:^{

         // 不加外面的block,直接写下面的,会直接跳回到原来位置,没有动画效果

            self.myView.transform = CGAffineTransformTranslate(self.myView.transform, -100, -100);

        }completion:^(BOOL finished) {
            // 第一次动画结束后的结束后,再进行新的动画
#pragma mark --- 缩放
          // 要有动画效果,还得套一个
        [UIView animateWithDuration:1 animations:^{
          // 填的是缩放的比例
        self.myView.transform = CGAffineTransformScale(self.myView.transform, 2, 2.5);
          }];
        }];
}];

#pragma mark --- 旋转

[UIView animationWithDuration:0.001 animation:^{
       // 改变视图的弧度
     self.myView.transform = CGAffineTransformRotate(self.myView.transform, M_PI_4  / 2);
}completion:^(BOOL finished) {
            // 转完之后 , 再转一次
            // 直接调用自己 递归,实现一直转动的效果
            [self MyViewRotate];
}];

--------------------------------------------------------------------------------------
 #pragma mark ---   两个View之间的跳转:动画的翻页,左转,右转,上翻,下翻等效果
//1.从rootVC.view -> secondVC.view
- (void)click:(UIBarButtonItem *)item
{
    SecondViewController *secondVC = [[SecondViewController alloc] init];

    // 从哪个view到哪个view
    // 达成的动画效果
    [UIView transitionFromView:self.view toView:secondVC.view duration:1 options:UIViewAnimationOptionTransitionFlipFromLeft completion:nil];

// 红色的就是实现不通的动画效果的枚举
// 再通过push到下一个页面(不写的话导航栏不会跟着转)
    [self.navigationController pushViewController:secondVC animated:NO];

}

//2.再从secondVC.view 回到 rootVC.view
- (void)click:(UIBarButtonItem *)item
{
    // pop返回

    // 取出上一个控制器
         // 注意,这里不能建一个新的rootVC,我们需要的是来到secondVC的那个rootVC
    RootViewController *rootVC = self.navigationController.viewControllers[0];
    // 跳转
    [UIView transitionFromView:self.view toView:rootVC.view duration:1 options:UIViewAnimationOptionTransitionCurlUp completion:nil];
    [self.navigationController popViewControllerAnimated:NO];
}

--------------------------------------------------------------------------------------
#pragma mark --- CALayer

     /*
     视图的构成 分两部分
     最底下是UIView ,UIView的上面有一个Layer层
     layer层是负责渲染视图
     UIView负责把渲染完成的视图,展示出来
     UIVIew好比画布,layer好比画布上的画
     */
// 设置layer属性
// 设置圆角 的值为 (前提视图得是正方形)宽的一半为圆
self.imageV.layer.cornerRadius = self.imageV.frame.size.width/2;
// 设置阴影 CGColorRef 绘制图层的颜色 (需要转化)
self.imageV.layer.shadowColor = [UIColor blackColor].CGColor;
// 设置阴影的偏移量
self.imageV.layer.shadowOffset = CGSizeMake(0,0);
// 设置模糊的程度
self.imageV.layer.shadowRadius = 50;
// 设置透明度
self.imageV.layer.shadowOpacity = 1;
// 边框颜色
self.imageV.layer.borderColor = [UIColor magentaColor].CGColor;
// 边框大小
self.imageV.layer.borderWidth = 2;

// CAAnimation 抽象类
    // 旗下有三个子类
    // 1.CAAnimationGroup 设置组动画 (可以添加其他类型的动画 到组里);
    // 2.CAPropertyAnimation 属性动画 抽象类  有两个子类,
      // 分别是:1⃣️CABasicAnimation 基本动画 旋转,改变大小等
      //       2⃣️CAKeyFrameAnimation 可以设置轨迹动画 (改变一组的值)
    // 3.CATransition 过渡动画 私有动画

// 重点:
// 总结layer动画的步骤:

/*
 1.选取合适的类去创建动画 (修改1个值就用基本动画,修改一组值就用轨迹动画)
 2.创建动画 并且设置要修改的值
 3.添加到要展示动画的视图的layer层上

 */

#pragma mark ---- 旋转
- (void)buttonClick1:(UIButton *)button
{
    // 注意:keyPath 一个字母都不能差 , 可以查表

    // 创建基本动画
    // 修改的是 形变属性 中的 弧度 的 x轴 的值
// 只改变一个值,就用base
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.y"];
    // 修改值
    // 由于修改时需要把 基本数据类型 或者 结构体类型 转化成对象类型(NSNumber 或者 NSValue)
    animation.toValue = [NSNumber numberWithFloat:M_PI]; // pi 是指 派(3.1415)

    // 设置动画的时间
    animation.duration = 2;
    // 设置重复的次数
    animation.repeatCount = CGFLOAT_MAX;
    // 把动画添加到layer层上
    [self.imageV.layer addAnimation:animation forKey:@"transform.rotation.x"];


}


#pragma mark ---- 改视图的大小
- (void)buttonClick2:(UIButton *)button
{

    // 创建一个base动画
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"bounds.size"];
    // 修改值 (从一个值修改到另一个值)
    animation.fromValue = [NSValue valueWithCGSize:CGSizeMake(0, 0)];
    animation.toValue = [NSValue valueWithCGSize:CGSizeMake(200, 200)];
    // 设置时间
    animation.duration = 1;
    animation.repeatCount = 1;
    // 添加动画到视图的layer层上
    [self.imageV.layer addAnimation:animation forKey:@"bounds.size"];

}

#pragma mark ---- 改变一组背景颜色
- (void)buttonClick3:(UIButton *)button
{
    // 修改一组值的变化,所以用key
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];
    // 创建一组颜色
    CGColorRef red = [UIColor redColor].CGColor;
    CGColorRef black = [UIColor blackColor].CGColor;
    CGColorRef orange = [UIColor orangeColor].CGColor;
    // 需要把颜色 强转成对象类型 放进数组
    animation.values = @[(id)red,(id)black,(id)orange];
    // 设置时间
    animation.duration = 2;
    animation.repeatCount = CGFLOAT_MAX;
    // 添加动化到layer上
    [self.imageV.layer addAnimation:animation forKey:@"backgroundColor"];

}

#pragma mark ---- 按轨迹移动 调整位置
- (void)buttonClick4:(UIButton *)button
{
    // 一组值的变化
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
    NSLog(@"%@",NSStringFromCGPoint(self.imageV.layer.position));

    // 创建点
    CGPoint p1 = CGPointMake(100, 0);
    CGPoint p2 = CGPointMake(100, 300);
    CGPoint p3 = CGPointMake(300, 300);
    CGPoint p4 = CGPointMake(300, 100);
    CGPoint p5 = CGPointMake(200, 100);
    CGPoint p6 = CGPointMake(200, 200);
    // 转化成对象类型
    NSValue *v1 = [NSValue valueWithCGPoint:p1];
    NSValue *v2 = [NSValue valueWithCGPoint:p2];
    NSValue *v3 = [NSValue valueWithCGPoint:p3];
    NSValue *v4 = [NSValue valueWithCGPoint:p4];
    NSValue *v5 = [NSValue valueWithCGPoint:p5];
    NSValue *v6 = [NSValue valueWithCGPoint:p6];
    // 添加到数组里
    animation.values = @[v1,v2,v3,v4,v5,v6];

    animation.duration = 5;
    animation.repeatCount = CGFLOAT_MAX;

    // 把动画添加到处layer蹭上
    [self.imageV.layer addAnimation:animation forKey:@"position"];

}

#pragma mark ---- 来回晃动
- (void)buttonClick5:(UIButton *)button
{
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position.x"];

    // 获取当前点的x坐标
    CGFloat centerX = self.imageV.layer.position.x;
    // 左边的值
    CGFloat leftX = centerX - 100;
    // 右边的值
    CGFloat rightX = centerX + 100;
    // 将这三个值全部转化成对象类型 装载到动画的values的数组中
    NSNumber *center = [NSNumber numberWithFloat:centerX];
    NSNumber *left = [NSNumber numberWithFloat:leftX];
    NSNumber *righr = [NSNumber numberWithFloat:rightX];

    // 添加到数组里
     animation.values = @[center,left,righr,center,left,righr,center,left,righr,center,left,righr,center,left,righr,center,left,righr,];

    animation.duration = 0.3;
    animation.repeatCount = CGFLOAT_MAX;

    // 把动画添加到处layer蹭上
    [self.imageV.layer addAnimation:animation forKey:@"position.x"];
}

#pragma mark ---- 抖动
- (void)buttonClick6:(UIButton *)button
{
        CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation"];


        // 添加到数组里 (变值 为角度)
        animation.values = @[@(-M_PI_4 /90.0 * 10),@(M_PI_4 /90.0 * 10),@(-M_PI_4 /90.0 * 10)];

        animation.duration = 0.5;
        animation.repeatCount = CGFLOAT_MAX;

        // 把动画添加到处layer蹭上
        [self.imageV.layer addAnimation:animation forKey:@"transform.rotation"];

}

#pragma mark ---- 3D转动
- (void)buttonClick7:(UIButton *)button
{
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
    // 根据x,y,z轴进行角度转动
    NSValue *value = [NSValue valueWithCATransform3D:CATransform3DRotate(self.imageV.layer.transform, M_PI, 100, 100, 100)];
    animation.toValue = value;
    animation.duration = 3;
    animation.repeatCount = CGFLOAT_MAX;
    [self.imageV.layer addAnimation:animation forKey:@"transform"];


}

#pragma mark ---- 组动画
- (void)buttonClick8:(UIButton *)button
{
     // 创建组动画对象
    CAAnimationGroup *group = [CAAnimationGroup animation];

    // 建一个基本动画
    CABasicAnimation *baseAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"];
    baseAnimation.toValue = [NSNumber numberWithFloat:M_PI];
    baseAnimation.duration = 3;
 //---------------------------------------------------------
    // 再写一个轨迹动画 改变颜色
    CAKeyframeAnimation *keyAnimation = [CAKeyframeAnimation animationWithKeyPath:@"backgroundColor"];
    // 创建一组颜色
    CGColorRef red = [UIColor redColor].CGColor;
    CGColorRef black = [UIColor blackColor].CGColor;
    CGColorRef orange = [UIColor orangeColor].CGColor;
    // 需要把颜色 强转成对象类型 放进数组
    keyAnimation.values = @[(id)red,(id)black,(id)orange];
    // 设置时间
    keyAnimation.duration = 2;
 //---------------------------------------------------------
    CAKeyframeAnimation *keyAnimation2 = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation"];
    // 添加到数组里 (变值 为角度)
    keyAnimation2.values = @[@(-M_PI_4 /90.0 * 10),@(M_PI_4 /90.0 * 10),@(-M_PI_4 /90.0 * 10)];
    keyAnimation2.duration = 0.5;
 //---------------------------------------------------------

    // 把创建的动画添加到组中
    group.animations = @[baseAnimation,keyAnimation,keyAnimation2];
    // 设置时间
    group.duration = 5;
    group.repeatCount = CGFLOAT_MAX;
    // 添加
    [self.imageV.layer addAnimation:group forKey:@"group"];

}