Lottie en réaction native ne peut pas trouver des images?

Question

J'ai suivi tous les exemples Lottie pour React natif et regardé des questions qui ont le même problème comme Lottie animation on Expo mais j'ai importé avec succès une animation exportée vers .json via Bodymovin en utilisant React natif ici:

import React, {Component} from 'react'; 
import Animation from 'lottie-react-native'; 
import { 
    StyleSheet, 
    Text, 
    View, 
    Animated, 
    Easing, 
    ScrollView, 
    RefreshControl, 
    AppRegistry 
} from 'react-native'; 

export default class LottieTest extends Component { 
    componentDidMount() { 
    this.animation.play(); 
    } 
    render() 
    { 
    //console.log(this.); 
    return (
     <View> 
     <Animation 
     ref={animation => { this.animation = animation; }} 
     style={{ 
      width: 500, 
      height: 500 
     }} 
     source={require('./animations/btn1.json')} 
     /> 
     </View> 
    ); 
    } 
} 

Je suis en train de dans une vue, ce n'est pas le problème. Le fichier json d'animation ne trouve pas les images, donc seules les formes (vecteurs qui ont été convertis en formes dans Aftereffects) sont affichées.

Je n'arrive pas à comprendre pourquoi le json ne trouve pas le chemin vers les images. Mon dossier d'images est dans le même dossier que le .json et j'ai changé le chemin ici pour correspondre à la classe, il est appelé à partir de:

,"fr":29.9700012207031,"ip":0,"op":34.0000013848484,"w":861,"h":861,"nm":"button1","ddd":0,"assets":[{"id":"image_0","w":782,"h":782,"u":"../animations/images/","p":"img_0.png"} 

Comment puis-je importer des images à l'aide React native et Lottie? Quel est le problème ici?

Answer 1

Les images pour animation doivent être ajoutées à XCode et projets Android Studio directement.

donc vous devriez avoir .json fichier dans React projet autochtones et actifs image dans ios/android projets.