React-native-vector-icons: Support for new Google Material icon styles

[doertli]

Would be great to add support for Google's updated material icon styles.
(Rounded FTW!)

eg: https://material.io/tools/icons/?style=round

[nlemsieh]

+1

[havinhthai]

+1

[abrantes01]

Do we have any news about this feature/support?

[hampustagerud]

The problem is that there is no font to use, the only font files seems to exist in the github repo which was last updated 2 years ago... Also, it only seems to include regular icons (which are already included here). There's not even an icon font to download and convert...

This repo uses a script to generate a download script for all icons but it seems like it still involves a lot of manual labor and they don't convert the files to a font.

I have been working on a new version of FontAwesome5 that is universal and would be able to handle these styles as well but I don't have time to tinker with the download. So if anyone could come up with a solution that automates the download and creation of the fonts (should result in one font file per style). You can check out the repo above to see what they do but don't copy-paste since it is still quite manual and upgrading the font should be as easy as possible. Also, while ts-material-icons-svg has an npm package I feel it's better to rely on google than a user-supplied npm package 🙂

You can check out this script to get an idea of how compiling the font could work.

If someone else can do this, I can get it up and running with the new code for FA5 🙂

[ycai2]

@hampustagerud I have created a ttf file for rounded Google Material Icons here, but I haven't had time to get a working package. The way I did it was a bit hacky, but it would work for now. I'm adding the other themes too over the weekend. Wonder if we can add it to this repo or make my process more automated. Please check out https://github.com/ycai2/themed-google-material-icons and let me know if it helps.
As you probably know, currently it requires a lot of manual work to convert the SVGs into a font, but font seems to be the only optimized way to render icons in react native so I was willing to do the manual work. If possible, I can try to generate the proper ttf's for different themes and add them to this project (react-native-vector-icons), if anyone can guide me on how to add it.
And @doertli, if you just want the rounded icons' ttf file, the pre-generated file in my repo should already suffice, if you still need it.

[hampustagerud]

@ycai2 I did it myself and now I have a working script that downloads and builds all fonts fully automatically in about 12 mins (sooo many icons to download, 5000+). I also remove duplicates which reduces the size with a couple of Mbs. But there is only about 50 styled icons so I doubt they will be used at all but now the work is basically done so whatever. I can finish the new core functionality when FA5.7 is released and then get to integrating the new MaterialIcon fonts.

[soumyamishra89]

Any update on the different material icons themes (e.g. outlined)?

[harveyconnor]

+1 I'd be keen to have these available too.
I'm interested in Solid and Outline being available

[noelsp]

+1

[yigithanyucedag]

+1
I need outlined material icons themes

[eddskt]

+1

[iljinjung]

.... +1

[fahimk]

Looks like the other styles are in the fonts git repo now: https://github.com/google/material-design-icons/tree/master/font