search

oblador / react-native-vector-icons

Customizable Icons for React Native with support for image source and full styling.
https://oblador.github.io/react-native-vector-icons/
MIT License
17.45k stars 2.12k forks source link

resizeMode for Icons ? #437

Closed thurt closed 7 years ago

thurt commented 7 years ago

React Native's Image component has a resizeMode property. http://facebook.github.io/react-native/releases/0.43/docs/image.html#resizemode

I want an svg icon from react-native-vector-icons to automatically resize to fit the width of its container.

Is there a way to do this that I am not seeing? Or would this be something we could add to this library?

Thanks!

oblador commented 7 years ago

If you use getImageSource you can use them with an Image component and use resizeMode.

thurt commented 7 years ago

thanks ill try it out!

thurt commented 7 years ago

question for you @oblador , is the time to Promise resolution affected by what size png i am generating with getImageSource?

my use case: I have a startup screen where i want to display a logo icon with perfect fidelity & also scaled to whatever the width of the device screen is. My current implementation is to use react native's Dimensions.get('window') and use those values to calculate a proper size prop for the svg icon.

I was looking for an easier way to do this, but getImageSource may not be much better than my current solution.

oblador commented 7 years ago

I wouldn't generate anything on the fly for this use case, can't you reuse whatever images or views you have fort the native splash screen?

thurt commented 7 years ago

that makes sense. could i use getImageSource to generate png images before running the application?

right now, i just received one svg for the logo. I may be using it in a few places and just passing a different size prop if i need it bigger or smaller. but getting it to automatically scale up to fit its container (the window) of unknown size is a problem that I must use Dimensions.get('window') for.

edit: just to clarify, i think creating raster graphics at multiple sizes for this logo is going to be more of a management pain than a single svg.

oblador commented 7 years ago

What I do in some projects are to generate PNGs from SVGs as a build step.