iOS之动画学习笔记一

标签：

      iOS复杂动画都是和贝塞尔曲线结合在一起的。因此要学会iOS动画，必须先理解贝塞尔曲线。贝塞尔曲线的教程网上很多，这里就不过多的阐述。主要还是来讲讲有关动画方面的东西。

一、画一条简单的曲线

我们先准备一条波浪形的贝塞尔曲线：    

    CGPoint startPoint = CGPointMake(50, 300);

    CGPoint endPoint = CGPointMake(300, 300);

    CGPoint onePoint = CGPointMake(150, 200);

    CGPoint twoPoint = CGPointMake(200, 400);

    UIBezierPath *path = [UIBezierPath bezierPath];

    path.lineWidth = 10.0f;

    path.lineCapStyle = kCGLineCapRound;

    [path moveToPoint:startPoint];

    [path addCurveToPoint:endPoint controlPoint1:onePoint controlPoint2:twoPoint];

但是贝塞尔曲线是一个抽象的对象。它的显示是要基于CALayer的。而CALayer的子类CAShapeLayer就是专门用于显示一条曲线的一个图层类。

    CAShapeLayer *layer = [CAShapeLayer layer];

    layer.path = [path CGPath];

    layer.strokeColor = [[UIColor redColor] CGColor];

    layer.fillColor = [[UIColor clearColor] CGColor];

    [self.view.layer addSublayer:layer];

二、给layer层添加动画

这个时候其实已经画好了一条曲线。但是它是静态的，要给它加动画就必须与CAAnimation一起使用。CAAnimation是一个抽象的动画类。下面我拿苹果文档中的一张图来展示Core Animation的层级关系，它是一个对OpenGL和Core Grapgics的封装。

用给这条曲线添加一个逐渐出现的动画，就要使用CABasicAnimation。其中CABasicAnimation是继承自CAPropertyAnimation的，

CAPropertyAnimation是继承自CAAnimation的。CABasicAnimation就只有三个属性，分别是(id)fromValue、(id)toValue、(id)byValue。

先来看一段代码：

    CABasicAnimation *anim = [CABasicAnimation animation];

    anim.keyPath = @"strokeEnd";

    anim.fromValue = @(0);

    anim.toValue = @(1);

    anim.duration = 2;

    anim.removedOnCompletion = NO;

    anim.fillMode = kCAFillModeForwards;

    [layer addAnimation:anim forKey:@"basicAnim"];

那么，其中的两个属性fromValue和toValue分别是什么，有什么作用呢？

首先，我们注意到这个三个属性都是id类型的，也就是后面可以跟任何形式的值。

例如，缩放动画：

    scaleAnimation.fromValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];

    scaleAnimation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(0.1, 0.1, 1.0)];

透明度变化：

    opacityAnimation.fromValue = [NSNumber numberWithFloat:1.0];

    opacityAnimation.toValue = [NSNumber numberWithFloat:0.1];

    tranformAnimation.fromValue = [NSNumber numberWithFloat:0.f];

    tranformAnimation.toValue = [NSNumber numberWithFloat:M_PI];

从上我们可以知道，fromValue代表着一个动画的初始状态，toValue代表着一个动画的结束状态。

iOS之动画学习笔记一

标签：

原文地址：http://blog.csdn.net/cranz/article/details/51330539