React Native Animationen in separaten Datei

Question

Animationen mit Animated mit React Native kann ziemlich groß werden und viel Platz einnehmen, vor allem, wenn Sie mehrere von ihnen haben. Gibt es eine Möglichkeit, sie in einer separaten Datei zu speichern, und wenn ja, wie würden sie heißen?

Animated.sequence([ 
    Animated.timing(this.state.move,{ 
    toValue: {x: 50, y: 100}, 
    duration:400 
    }), 
    Animated.timing(this.state.move,{ 
    toValue: {x: 0, y: 0, 
    duration:400,delay:400 
}), 
]).start() 

Answer 1

OK Ich habe herausgefunden, wie es geht. Erstellen Sie eine separate Datei wie folgt:

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

var Anims = { 
firstAnim(move) { 
Animated.sequence([ 
    Animated.timing(move,{ 
    toValue: {x: 50, y: 100}, 
    duration:400 
    }), 
    Animated.timing(move,{ 
    toValue: {x: 0, y: 0, 
    duration:400,delay:400 
    }), 
    ]).start() 
    } 
} 

module.exports = Anims; 

Dann benötigen sie wie folgt aus:

const Animations=require('./animations.js'); 

Und nennen Sie es wie folgt aus:

Animations.firstAnim(this.state.move);