0

I want to convert the local image file path to the uri path so that in place of uri where a website is require i want to put the local image directory. I am showing the code below..

state = {
        search: '',
        images: [
            '../../assets/assets/img/formula.png',  //***this  is not working
            'https://source.unsplash.com/1024x768/?water',
            'https://source.unsplash.com/1024x768/?girl',
            'https://source.unsplash.com/1024x768/?tree'
          ]
      };


//Image is used here..

<SliderBox images={this.state.images} />

In image array i want the first image must include from my local file image. Please someone tell how to do that so that in image I can include my local image file path

Rajat Verma
  • 420
  • 1
  • 7
  • 19

2 Answers2

1

You need to import Ex..:

import Formula from '../../assets/assets/img/formula.png';

Then you can use Formula as an image! You can use require('../../assets/assets/img/formula.png') too.

Mauricio Carlezzo
  • 140
  • 1
  • 7
  • but not working, as an array .i.e images array element is expecting the image as a uri format. – Rajat Verma Jun 19 '19 at 14:55
  • as you can the the commented part iamge object is as a local image file but there it expecting the uri path so how to convert that local image path to uri such that i can use that there – Rajat Verma Jun 19 '19 at 14:59
1

A bit late but hopefully it can help someone. You can use resolveAssetSource from Image, so going back to your code it would look like this,

state = {
    search: '',
    images: [
        Image.resolveAssetSource(require("../../assets/assets/img/formula.png")).uri,
        'https://source.unsplash.com/1024x768/?water',
        'https://source.unsplash.com/1024x768/?girl',
        'https://source.unsplash.com/1024x768/?tree'
      ]
  };

Of course you would need to import Image first,

import { Image } from "react-native";
Bur
  • 157
  • 2
  • 5