How to resolve 'Unable to find file' when updating a property in a Lottie Animation View?

Question

I have an issue with android. The file in the Android assets directory is not found.

Error:

Error while updating property 'sourceName' of a view managed by: LottieAnimationView

null

Unable to find file loading.js

Animation file location:

app/src/main/assets/loading.json

Component:

class Loading extends Component {

  componentDidMount() {
    this.animation.play()
  }

  render() {
    return (
      <View style={StyleSheet.loading.page}>
        <View style={StyleSheet.loading.animationWrapper}>
          <Animation
            ref={animation => { this.animation = animation }}
            style={StyleSheet.loading.animation}
            loop
            source="loading.json"
          />
        </View>
        <Text style={StyleSheet.loading.text}>LOADING</Text>
      </View>
    )
  }
}

Versions:

"lottie-react-native": "2.2.0"
"react-native": "0.47.2"

Apparently closing / reopening the project in Android Studio was enough to get it to work correctly. — chandrakant sharma, Sep 21 '17 at 13:47

score 0 · Answer 1 · edited Dec 15 '21 at 14:27

0

you should add your loading.json file in your javascript source code and require it

<Animation
   ref={animation => { this.animation = animation }}
   style={StyleSheet.loading.animation}
   loop
   source={require('./loading.json')}
/>

edited Dec 15 '21 at 14:27

TylerH

20,799
66
75
101

answered Sep 21 '17 at 16:09

Mohamed Khalil

3,036
1
20
26

How to resolve 'Unable to find file' when updating a property in a Lottie Animation View?

1 Answers1