react-native 动画Animated，高度变化的动画

在react-native中我们使用Animated来编写动画的代码。

参考文档：react-native 动画api

在项目实践中，用到的是最简单的Animated.timing，实现view组件根据高度变化的过渡动画。

如图，点击收起的时候，日历高度变化，在高度变化的过程中有个动画过渡的效果。

同样，收起以后，再点击展开也会有一个高度变化的动画过渡效果。

以下是代码的实现

1.引入Animated

import {Animated} from ‘react-native’

2.设置日历的初始maxHeight，初始化Animated

constructor(props) {
	super(props)
	this.state = {
		calHeight: new Animated.value(500)，
		calShow: true
	}
	this.fadeOutAnimated = Animated.timing(
            this.state.calHeight,{
                toValue: 160,
                duration: 150