React-Native 学习Animated -1

//Animated.timing实现view的位置移动
import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Animated, TouchableHighlight, View, Text} from 'react-native';

var xx = 0;
class RnAnimatedView extends Component {
    constructor(props) {
        super(props);
        this.state= {
            left: new Animated.Value(0),
        }
    }
    render() {
        let animView = (
            //这里需要使用transform， rotateX被包含在transform的属性中。
            //interpolate很特殊，可以插入一些参数
            
                我要开始移动了
            
        );
        return(
            
                
                    点我开始动画
                
                {animView}
            
        )

    }
    animation= () => {
        xx = xx === 0 ? 1 : 0;
        let timing = Animated.timing;
        timing(this.state.left, {
            toValue: xx,
            duration: 1000,
        }).start();
    }
}
AppRegistry.registerComponent('RnAnimatedView', () => RnAnimatedView);

Untitled3.gif