动画学习1

常看见别人写的动画十分羡慕,自己也看些文章,但大都是照着抄一遍,没有自己的发挥,但是自己不总结的话可能代码也白敲了吧,下面的代码都是从别的地方搬过来的,加上自己的理解.

1.旋转动画

(1)添加view和layer,给layer添加图像

[code]view = [[UIView alloc]initWithFrame:self.view.bounds];
view.backgroundColor = [UIColor lightGrayColor];
[self.view addSubview:view];

shipLayer = [CALayer layer];
shipLayer.frame = CGRectMake(0, 0, 128, 128);
shipLayer.position = CGPointMake(150, 150);
shipLayer.contents = (__bridge id)[UIImage imageNamed:@"huaji.jpg"].CGImage;
[view.layer addSublayer:shipLayer];

(2)添加开始和停止按钮

开始:

[code]CABasicAnimation * animation = [CABasicAnimation animation];
animation.keyPath = @"transform.rotation";
animation.duration = 2.0;
animation.byValue = @(M_PI * 2);
animation.delegate = self;

[shipLayer addAnimation:animation forKey:@"rotateAnimation"];

停止:

[code][shipLayer removeAnimationForKey:@"rotateAnimation"];

(3)停止动画方法

[code]-(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{
    NSLog(@"The animation stopped (finished: %@)", flag? @"YES": @"NO");
}

2.用贝塞尔曲线绘制动画轨迹

[code]UIBezierPath * bezierPath = [[UIBezierPath alloc]init];
[bezierPath moveToPoint:CGPointMake(0, 150)];
//    point1 起点,point2 终点
[bezierPath addCurveToPoint:CGPointMake(300, 150) controlPoint1:CGPointMake(75, 0) controlPoint2:CGPointMake(225, 300)];
//    用CAShapeLayer画图
CAShapeLayer * pathLayer = [CAShapeLayer layer];
pathLayer.path = bezierPath.CGPath;
pathLayer.fillColor = [UIColor clearColor].CGColor;
pathLayer.strokeColor = [UIColor redColor].CGColor;
pathLayer.lineWidth = 3.0f;

//    添加贝塞尔曲线
//    [view.layer addSublayer:pathLayer];

shipLayer = [CALayer layer];
shipLayer.frame = CGRectMake(0, 0, 64, 64);
shipLayer.position = CGPointMake(0, 150);
shipLayer.contents = (__bridge id)[UIImage imageNamed:@"huaji.jpg"].CGImage;
[view.layer addSublayer:shipLayer];

CAKeyframeAnimation * animation = [CAKeyframeAnimation animation];
animation.keyPath = @"position";
animation.duration = 4.0;
//    用bezier来确定path
animation.path = bezierPath.CGPath;

//    沿着切线旋转
animation.rotationMode = kCAAnimationRotateAuto;
//    给layer层添加动画
[shipLayer addAnimation:animation forKey:nil];

3.3D旋转

[code]CABasicAnimation * animation = [CABasicAnimation animation];
animation.keyPath = @"transform";
animation.duration = 2.0;
animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI, 0, 1, 1)];
[shipLayer addAnimation:animation forKey:nil];

4.比上面给流畅的旋转

[code]CABasicAnimation * animation = [CABasicAnimation animation];
animation.keyPath = @"transform.rotation";
animation.duration = CGFLOAT_MAX;
animation.byValue = @(M_PI * 2);
[shipLayer addAnimation:animation forKey:nil];

5.贝塞尔轨迹动画+颜色转变

[code]UIBezierPath * bezierPath = [[UIBezierPath alloc]init];
[bezierPath moveToPoint:CGPointMake(0, 150)];
[bezierPath addCurveToPoint:CGPointMake(300, 150) controlPoint1:CGPointMake(75, 0) controlPoint2:CGPointMake(225, 300)];
//    [bezierPath addLineToPoint:CGPointMake(300, 150)];

[code] CAShapeLayer * pathLayer = [CAShapeLayer layer];
 pathLayer.path = bezierPath.CGPath;
 pathLayer.fillColor = [UIColor clearColor].CGColor;
 pathLayer.strokeColor = [UIColor redColor].CGColor;
 pathLayer.lineWidth = 3.0f;
 [view.layer addSublayer:pathLayer];

 CALayer * colorLayer = [CALayer layer];
 colorLayer.frame = CGRectMake(0, 0, 64, 64);
 colorLayer.position = CGPointMake(0, 150);
 colorLayer.backgroundColor = [UIColor greenColor].CGColor;
 [view.layer addSublayer:colorLayer];

CAKeyframeAnimation * animatin1 = [CAKeyframeAnimation animation];
animatin1.keyPath = @"position";
animatin1.path = bezierPath.CGPath;
animatin1.rotationMode = kCAAnimationRotateAuto;

CABasicAnimation * animation2 = [CABasicAnimation animation];
animation2.keyPath = @"backgroundColor";
animation2.toValue = (__bridge id)[UIColor redColor].CGColor;
//添加动画组动画
CAAnimationGroup * groupAnimation = [CAAnimationGroup animation];
groupAnimation.animations = @[animatin1,animation2];
groupAnimation.duration = 4.0;
[colorLayer addAnimation:groupAnimation forKey:nil];