进击 的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"];

}