Stack Overflow
Stack Overflow

Questions tagged [react-native-svg]

Use for react-native-svg, a JavaScript library to use\write SVG images in react-native

react-native-svg is a JavaScript library that provides both iOS and Android to be able to use\write SVG images in react-native. SVG or Scalable Vector Graphics are a kind of images that are produced by using XML scripts. This makes the images to be able to be indexed, searched and compressed. These images are interactive due to the scripts, and can also be animated thus.

https://www.npmjs.com/package/react-native-svg

275 questions
0
votes
1 answer

Importing Different Images into the Image Component react-native-svg

Question Guys, since I am already having problems importing image I need to show different images in each mode, but when trying an error is…
Andersonfrfilho
  • 130
  • 11
0
votes
0 answers

Resizing svg without croping the image

I converted svg into React Component using https://www.smooth-code.com/open-source/svgr/playground/ When I placed it in an app component it crops the image. What is the proper way to resize/scale svg inside a component without affecting the…
Dev
  • 67
  • 10
0
votes
1 answer

How to highlight barchart when user onPress the chart in react-native

Is this possible using the onPress event can change the bar chart's particular bars colour or styles? https://github.com/JesperLekland/react-native-svg-charts Anybody, please help me.
EDISON J
  • 324
  • 3
  • 12
0
votes
0 answers

Is it possible to add onPress event to svg graphic which was loaded from file in React Native?

In my React Native application I need to load a svg graphic from a file and add onPress events to suitable svg elements based on element ids. I want to ask if it is possible in React Native? To add the svg file I plan to use the solution form…
siergiejjdw
  • 601
  • 5
  • 7
0
votes
1 answer

How to animate a part of an svg file in React Native

I'm working on a react native app, and I need to animate (rotate around central point) a part of an svg file. how can I access the component I want to animate ? I've tried to convert the svg file in jsx format. but still I cannot access the…
F.MANNOU
  • 23
  • 1
  • 7
0
votes
0 answers

Svg not showing correctly

I've been using react-native-svg and react-native-svg-transformer to render svg files in my app and it's worked fine. However, It didn't work for one specific svg file. The file size is only about 281 kb, while the other worked file size is about…
Geek
  • 1
  • 1
0
votes
1 answer

React-Native : Error while updating property 'd' in shadow node of type RNSVGPath for input string 'h'

Facing this issue for few icons while using react-native-svg . I have gone through many git hub and stack over flow discussions like these, But unable to figure out the exact root cause. In my case I am down loading Flat icons in svg format and…
ThinkAndCode
  • 1,319
  • 3
  • 29
  • 60
0
votes
0 answers

Linear gradient renders black when implemented using react-native-svg

React-Native Version: 0.59.8 react-native-svg version: 9.4.0 OS Implementation: Android I have written some SVG code in HTML and it works as expected:
Harshdeep Singh
  • 327
  • 1
  • 5
  • 18
0
votes
1 answer

Animate a Circle around another circle

I'm using react-native-svg. I'd like to animate a small circle around another bigger circle. This question is similar to this one. The animation is not tied to any gesture but time. The rotation should take a predefined delay in seconds to complete…
anon
0
votes
1 answer

How to grow the touchable area on React Native SVG elements on Android?

As part of a SVG sketch, I use a quite small dot as a slider control. To grow the touchable area I have added a thick, transparent border. This works on iOS, but not on Android. What can I do on Android to fix this? I've tried adding hitSlop and…
PEZ
  • 16,821
  • 7
  • 45
  • 66
0
votes
1 answer

Upgrade Expo react-native-svg dependency version

My Expo project requires the latest version of react-native-svg library to render my SVGs correctly. Currently it's version 9.3.5 From package-json.lock, I see that my current Expo SDK 32 has version 8.0.10 listed. "dependencies": { …
Augusto Samamé Barrientos
  • 1,314
  • 14
  • 36
0
votes
2 answers

React native: "only the original thread that created a view hierarchy can touch its views"

pressing the button to get the base64 string of the svg ... produces the following error: - Only the original thread that created a view hierarchy can touch its views render() { return (
Hend El-Sahli
  • 6,268
  • 2
  • 25
  • 42
0
votes
1 answer

How do I 'cover fit' this image to my Path?

How do I properly display the profile picture inside this shape instead of making a cut of the image? …
Josh
  • 2,430
  • 4
  • 18
  • 30
0
votes
1 answer

React Native- Scrollable SVG Text

My aim is to have scrollable svg text on screen but I can't seem to fathom out how. Firstly, before I attempted to make the text scrollable, I started of with the following code: …
Matt Jameson
  • 582
  • 3
  • 16
0
votes
1 answer

App crashes when adding mask prop to Circle

I'm trying to 'copy' this https://codepen.io/dannyb9737/pen/jQJZWO I tried also to reproduce it in the sandbox - https://snack.expo.io/Bk-s-2MyN but seems like the Component Mask is undefined :( to work into react-native, but the app keep crashing…
Danny
  • 793
  • 1
  • 9
  • 20
1 2 3
…
18
19