Unrecognized font family "Material Design Icons"

[Eyesonly88]

Issue summary

Breaking error happens when trying to render the MultiSelect component.

I'm not doing anything special and I have latest react-native-vector-icons and the fonts that come with it.

My code is this:

<MultiSelect
                  items={Object.values(myDataObject)}
                  uniqueKey="uri"
                  onSelectedItemsChange={this.onSelectedItemsChange}
                  selectedItems={this.state.selectedItems}
                  searchInputPlaceholderText="Type Item Name..."
                  altFontFamily="System"
                  tagRemoveIconColor="#CCC"
                  tagBorderColor="#CCC"
                  tagTextColor="#CCC"
                  selectedItemTextColor="#CCC"
                  selectedItemIconColor="#CCC"
                  itemTextColor="#000"
                  displayKey="label"
                  searchInputStyle={{color: '#CCC'}}
                />

I tried different fonts in the altFontFamily and tried removing the option alltogether.

Library versions

react-native: 0.53.3 react-native-multiple-select: 0.4.1 react-native-vector-icons: 4.5.0

Steps to Reproduce

1. Import MultiSelect
2. Try to render it

Expected Behavior

I expect it to render and work as described.

(Write what you thought would happen.)

Actual Behavior

I get this error

I tried rm -rf ios/build and rm -rf node_modules and react-native link I also cleaned the project and rebuild The error keeps happening.

Reproducible Code

My code is this:

<MultiSelect
                  items={Object.values(myDataObject)}
                  uniqueKey="id"
                  onSelectedItemsChange={this.onSelectedItemsChange}
                  selectedItems={this.state.selectedItems}
                  searchInputPlaceholderText="Type Item Name..."
                  altFontFamily="System"
                  tagRemoveIconColor="#CCC"
                  tagBorderColor="#CCC"
                  tagTextColor="#CCC"
                  selectedItemTextColor="#CCC"
                  selectedItemIconColor="#CCC"
                  itemTextColor="#000"
                  displayKey="label"
                  searchInputStyle={{color: '#CCC'}}
                />

I tried different fonts in the altFontFamily and tried removing the option alltogether.

[cyclone747]

Same here also Ensure to add and configure react-native-vector-icons react-native link i did everything lastly just i shut down all the thing and start it again mine is working fine.

[Eyesonly88]

@cyclone747 interesting, what React Native version are you on? FYI - I ended up building my own and using it now so don't need this library anymore.

[cyclone747]

 thanks for replaying me . below is my details

"react": "16.3.0-alpha.1",
"react-native": "0.54.1",
"react-native-multiple-select": "^0.4.1",
"react-native-quick-select": "0.0.4",
"react-native-vector-icons": "^4.5.0"

[JeremyBradshaw7]

Also having this problem.

[manuel-delaiglesia]

Same issue using the font in the example. Message is: Unrecognized font family 'ProximaNova-Light' RN 0.55.4 in OSX Sierra for iOS. Not reproduced in Windows for Android.

[Montaguti]

I had a similar issue. I solved updating from "react-native-vector-icons": v4.X to v5.0.0

[john-diaz]

No solution yet?

[Ksiner]

Import MaterialCommunityIcons.ttf to the project. You can find guid for importing fonts here https://github.com/oblador/react-native-vector-icons#ios and here https://github.com/oblador/react-native-vector-icons#android.