Question 222967 in React native Question posted in
The official React Native documentation can be found here.

React native – lottie-react-native is not showing

I tried many times but it’s not showing

i want to show and resolve this problem,

here are my code

import { View, Text } from 'react-native'
import React from 'react'
import LottieView from 'lottie-react-native';

const App = () => {
  return (
    <View style={{ backgroundColor: 'white', height: '100%' }}>
      <Text style={{ color: 'black' }}>Helo World</Text>
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center', width: '100%', backgroundColor: 'red'}}>
        <LottieView
          source={require('./PoliteChicky.json')}
          style={{width: '100%'}}
          autoPlay
          loop
        />
      </View>
    </View>
  )
}

export default App

Tags:

2

Answers


  1. 0

    He Goku Sama, i’ve something like this and works, please try to create a folder inside your src folder like image bellow and place the json from lottie inside. If this doesn’t works, can you share your project on github so we can take a better look on it.

    enter image description here

    This is a lottie animation:
    enter image description here

    Login or Signup to reply.
  2. 0

    Add this in your package.json file ,

    "lottie-react-native": "^5.1.5",

    Import this in your desired file

    import LottieView from "lottie-react-native";

    Use the LottieView as follows in your desired page

      <LottieView
                  source={images.searchloading}
                  style={{ width: 100, height: 100 }}
                  autoPlay
                  loop
                />
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search