seekshiva / react-native-remote-svg

Adds support for loading svg images in React Native
MIT License
184 stars 71 forks source link

Changing the color of vectors #2

Closed cassioseffrin closed 6 years ago

cassioseffrin commented 6 years ago

Hi seekshiva,

First, congrats for your awesome job in this library. I think your approach for svg icons is the best and the easiest.

I don't think my question is an issue. However, I can't find a way to change the color of the icon. The default image doesn't have this prop. Maybe it's just my mistake, could you give me a help?

Best Regards!

seekshiva commented 6 years ago

Hi @cassioseffrin,

You can convert a set of svg images to font files using these techniques. Since these are just fonts, you can set color in style prop to set the icon color.

Additionally, you can use react-native-vector-icons to define a glyphMap so that you can use it like this:

<Icon name="rocket" size={30} color="#900" />

In glyphMap, you will be defining the mapping between icon name (eg: 'rocket') to the exact character in font that will render that icon.

More info on how to define custom fonts with react-native-vector-icons here.

cassioseffrin commented 6 years ago

@seekshiva Thanks for the suggestions, I liked them all!