React Native Android local image

Question

I have this

<Image style={styles.image} source={require('image!logo')}/>

Where the logo.png is added to android/app/src/main/res folder.

But the image is not getting displayed(I have re-run react-native run-android).

Do i need to do some other changes?

Note that using <Image source={{uri: http://path/to/image}}/> works.

Answer 1

The image file needs to go in the appropriate drawable-xxx folder under res.

Try putting logo.png in android/app/src/main/res/drawable-hdpi and then rebuilding your app.

There's some information on the React Native site: https://facebook.github.io/react-native/docs/image.html#adding-static-resources-to-your-android-app

Answer 2

1. After adding images you probably need to 'hard restart' the project. Just reloading the JS probably won't show the image.

2. Since React Native 0.14, you can require images just like requiring JS files.

   <Image source={require('./img/check.png')} />
   

3. Did you try to give your image some height?