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 = [UIBezierPathbezierPath];

    path.lineWidth =10.0f;

    path.lineCapStyle =kCGLineCapRound;

    [path moveToPoint:startPoint];

    [path addCurveToPoint:endPointcontrolPoint1:onePoint controlPoint2:twoPoint];

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

    CAShapeLayer *layer = [CAShapeLayerlayer];

    layer.path = [path CGPath];

    layer.strokeColor = [[UIColorredColor] CGColor];

    layer.fillColor = [[UIColorclearColor] CGColor];

    [self.view.layeraddSublayer:layer];

二、给layer层添加动画

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

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

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

先来看一段代码：

    CABasicAnimation *anim = [CABasicAnimationanimation];

    anim.keyPath = @"strokeEnd";

    anim.fromValue = @(0);

    anim.toValue = @(1);

    anim.duration = 2;

    anim.removedOnCompletion =NO;

    anim.fillMode =kCAFillModeForwards;

    [layer addAnimation:animforKey:@"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代表着一个动画的结束状态。byValue代表着一个过程变化的值，比如formValue  = @(100); toValue = @(200);那么写成buValue = @(100);