Nativebase: Add iconFamily prop to Icon

Created on 5 Nov 2017  路  5Comments  路  Source: GeekyAnts/NativeBase

The current way Icon handles setting iconFamily makes it impossible if you want to have a one off icon from one of the other icon sets.

I understand that at that point I should just import directly from react-native-vector-icons but, if I do that, then I have to reapply all of the styles that I've put on IconNB.

Is there another way to handle this one off case aside from adding a prop to Icon?

awaiting response

Most helpful comment

Hey guy,

I faced the same problem and the solution is very simple!

You just need to import a tag "StyleProvider" and inside a style property pass a function "getTheme" a object with of the iconFamily you want to change in child components.

After that, you finally set a fontFamily to child components inside

Follow the example:

```
import { Icon, StyleProvider, getTheme } from 'native-base'



```

The problem resolved and sorry for my English!

All 5 comments

Hey guy,

I faced the same problem and the solution is very simple!

You just need to import a tag "StyleProvider" and inside a style property pass a function "getTheme" a object with of the iconFamily you want to change in child components.

After that, you finally set a fontFamily to child components inside

Follow the example:

```
import { Icon, StyleProvider, getTheme } from 'native-base'



```

The problem resolved and sorry for my English!

@gdaunton Did this workaround help you?

I did try that work around, but opted to make my own icon component that took a iconFamily prop.

Having to make a new StyleProvider every time I want to use an icon from a different iconFamily is a lot of unnecessary code that I don't want to have in my components. It works, but it feels like an antipattern.

1319

@gdaunton Take a look into this, probably what you are looking for

Added this to 2.3.8

Was this page helpful?
0 / 5 - 0 ratings