CODEWITHSUNDEEP
imagereact-nativeexpooffline
user3466163
user3466163

Reputation: 37

Cannot load offline image React Native using Expo Client iOS

I am not able to display an offline image using expo client on iOS in React Native, but it works perfectly on the web browser.

my app.json :

"assetBundlePatterns": [
  "**/*", "assets/*", "assets/fonts/*"
]

what i try to do :

<Image source={require('../assets/logo.svg')} style={{ width: 200, height: 200 }}/>

../assets because i'm in a component located in a folder "Components" :

assets
  logo.svg
Components
  MyComponent.js
App.js
app.json

Thanks !!

Upvotes: -1

Views: 423

Answers (1)

Muhammad Idrees
Muhammad Idrees

Reputation: 198

You are loading .svg file react-native-svg allows you to use SVGs in your app, with support for interactivity and animation. so that you need to install

expo install react-native-svg

The implementation is provided by react-native-svg, and documentation is provided in this

article.

import the json into your app and use react-native-svg to render the svg like this:

 const json = require('./svg.json');
 render() {
    return (
      <Svg height={200} width={200} >
        <Path d={json['path']} />
      </Svg>
    );
  }

and another option, you can create an icon set from your svgs using IcoMoon, and then use it through https://github.com/oblador/react-native-vector-icons

Upvotes: 1

Related Questions