vault-development / react-native-svg-uri

Render SVG images in React Native from an URL or static file
850 stars 334 forks source link

Add `viewBox` prop #126

Closed attitude closed 6 years ago

attitude commented 6 years ago

The viewBox attribute allows you to specify that a given set of graphics stretch to fit a particular container element

ezhlobo commented 6 years ago

@attitude as I understand viewBox right, it should be stick to the svg not to where we use it. That is strange to manipulate with viewBox from outside.

Could you provide more details about your issue?

attitude commented 6 years ago

@ezhlobo it adds an option to resize the final SVG output. Otherwise it will drawn the size specified by the original bounding box.

In my case, if I need icons to change size, there's no other way than from manipulating from outside:

simulator screen shot - iphone x - 2018-04-27 at 15 12 37

ezhlobo commented 6 years ago

@attitude actually viewBox should come from icon. And then you can set any dimensions you want via width and height. ViewBox attribute helps to fit coordinates of figures (or paths) to real size.

So I would vote for following svg intention and disallow changing of that property.

attitude commented 6 years ago

@ezhlobo I used https://jakearchibald.github.io/svgomg/ to clean SVG which by default removes viewBox hence creating issue where setting width nor height had no effect to scale SVG. Keeping viewBox in the markup fixed the issue.

Sorry for the confusion.

Thanks!