位移

import React from 'react';
import {
    View,
    Animated
} from 'react-native';

export default class MoveDemo extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            animatedValue: new Animated.Value(0)
        };
    }

    componentDidMount() {
        Animated.timing(this.state.animatedValue, {
            toValue: 300,
            duration: 500
        }).start();
    }

    render() {
        return(
            <View style={styles.container}>
                <Animated.View
                    style={[styles.box, {transform: [{translateY: this.state.animatedValue}]}]}
                />
            </View>
        );
    }
};

const styles = {
    container: {
        flex: 1,
        alignItems: 'center'
    },

    box: {
        width: 80,
        height: 80,
        backgroundColor: 'red',
        marginTop: 100
    }
};

results matching ""

    No results matching ""