在移动开发中，动画是提高用户体验不可缺少的一个元素。在React Native中，动画API提供了一些现成的组件：Animated.View，Animated.Text和Animated.Image默认支持动画。动画API会调用iOS或者Android的本地代码来完成这些组件的位移、大小等动画。

在React Native中，Animated创建过程如下：

1. 创建Animated.Value，设置初始值，比如一个视图的opacity属性，最开始设置Animated.Value(0),来表示动画的开始时候，视图是全透明的。
2. AnimatedValue绑定到Style的可动画属性，比如透明度，{opacity: this.state.fadeAnim}
3. 使用Animated.timing来创建自动的动画,或者使用Animated.event来根据手势，触摸，Scroll的动态更新动画的状态（本文会侧重讲解Animated.timing）
4. 调用Animated.timeing.start()开始动画

Animated简介

大多数情况下，在 React Native 中创建动画是推荐使用 Animated API 的，其提供了三个主要的方法用于创建动画：

1. Animated.timing() -- 推动一个值按照一个过渡曲线而随时间变化。Easing 模块定义了很多缓冲曲线函数。
2. Animated.decay() -- 推动一个值以一个初始的速度和一个衰减系数逐渐变为0。
3. Animated.sprin敏感词生一个基于 Rebound 和 Origami 实现的Spring动画。它会在 toValue 值更新的同时跟踪当前的速度状态，以确保动画连贯。

除了这三个创建动画的方法，对于每个独立的方法都有三种调用该动画的方式：

1. Animated.parallel() --同时开始一个动画数组里的全部动画。默认情况下，如果有任何一个动画停止了，其余的也会被停止。你可以通过stopTogether 选项来改变这个效果。
2. Animated.sequence() --按顺序执行一个动画数组里的动画，等待一个完成后再执行下一个。如果当前的动画被中止，后面的动画则不会继续执行。
3. Animated.stagger() -- 一个动画数组，里面的动画有可能会同时执行（重叠），不过会以指定的延迟来开始。

Animated.timing()

使用 Animated.timing 创建的旋转动画。Animated.timing()的基本使用方法如下：

Animated.timing( someValue,
  { toValue: number,
    duration: number,
    easing: easingFunction,
    delay: number
  }
)

Easing 也是用React Native创建动画的载体，它允许我们使用已经定义好的各种缓冲函数，例如：linear, ease, quad, cubic, sin, elastic, bounce, back, bezier, in, out, inout 。由于有直线运动，我们将使用 linear。
接下来，需要在构造函数中初始化一个带动画属性的值用于旋转动画的初始值：

constructor () {
  super()
  this.spinValue = new Animated.Value(0)
}