Cowboy Tech

iOS项目018.CAAnimation简介

CAAnimation

  1. 基础动画 CABasicAnimation
  2. 关键帧动画CAKeyframeAnimation
  3. 转场动画 CATransition
  4. 动画组 CAAnimationGroup

以上基础动画和关键帧动画是隐式动画,比如bound值是animable的

CABasicAnimation

viewController

@property (nonatomic, strong) CALayer *layer;

- (void)viewDidLoad {
[super viewDidLoad];

CALayer *layer =[CALayer layer];
layer.bounds = CGRectMake(0, 0, 100, 100);
layer.position = CGPointMake(100,100);
layer.backgroundColor = [UIColor yellowColor].CGColor;
[self.view.layer addSublayer:layer];
self.layer = layer;  

}

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
//[self animationScale];
//[self animationRotation];
//[self animationTranslate];
}

keyPath, toValue, fromValue, byValue

  1. keyPath 决定了执行怎样的动画
  2. toValue 到达哪个点
  3. byValue 是增加多少值
  4. fromValue 从哪个点开始移动

缩放

- (void)animationScale{

CABasicAnimation *animation = [CABasicAnimation animation];

animation.keyPath = @"bounds";
animation.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 50, 50)];

animation.duration = 2;
animation.removedOnCompletion = NO;
animation.fillMode = @"forwards";

[self.layer addAnimation:animation forKey:nil];
}

平移

//toValue是到达哪个点
animation.keyPath = @"position";
animation.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 200)];

//byValue是xy轴分别增加多少
animation.keyPath = @"position";
animation.byValue = [NSValue valueWithCGPoint:CGPointMake(200, 200)];

旋转

animation.keyPath = @"transform";
animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_4, 1, 1, 0)];

CAKeyframeAnimation

效果:方块绕椭圆轨迹运动

- (void)keyAnimation{
CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];

//这些是和CABasicAnimation一样的
anim.keyPath = @"position";
anim.removedOnCompletion = NO;
anim.fillMode = kCAFillModeForwards;
anim.duration = 2.0;

//设置动画的路径
CGMutablePathRef path = CGPathCreateMutable();
CGPathAddEllipseInRect(path, NULL, CGRectMake(100, 100, 200, 200));
anim.path = path;
CGPathRelease(path);

// 设置动画的执行节奏
// kCAMediaTimingFunctionEaseInEaseOut : 一开始比较慢, 中间会加速,  临近结束的时候, 会变慢
anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];

//可以执行代理方法
anim.delegate = self;

[self.layer addAnimation:anim forKey:nil];
}

CATransition

导航视图切换

-(IBAction)pushAction{

CATransition *transition = [CATransition animation];
transition.duration = 1;
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];

//私有API
//transition.type = @"pageCurl";
transition.type = @"cube";//立体动画效果

[self.navigationController.view.layer addAnimation:transition forKey:@"navAnimation"];
DetailViewController *detailVC = [[DetailViewController alloc]init];
[self.navigationController showViewController:detailVC sender:nil];
}

View切换

这里的animaView是UIViewController —> view 里的subView

-(IBAction)exchangeView{
CATransition *transition = [CATransition animation];
transition.duration = 1;
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];

//私有API
//transition.type = @"pageCurl";
transition.type = @"fade";
transition.subtype = kCATransitionFromRight;

//设置具体动画
[_animaView exchangeSubviewAtIndex:0 withSubviewAtIndex:1];
[_animaView.layer addAnimation:transition forKey:@"myAnimation"];

}