Closed NKGS closed 3 years ago
Happened to me too. Reinstalling npm packages and pods after removing package-lock.json
solved the problem for me.
Hi apgsn
Happened to me too. Reinstalling npm packages and pods after removing
package-lock.json
solved the problem for me.
I deleted node modules, package-lock.json and reinstalled all dependencies but still facing same issue. Also I tried to downgrade nativebase and react-native-vector-icons library but still facing same issue.
I'm facing the same problem after i updated react-native-vector-icons
Seems related to https://github.com/GeekyAnts/NativeBase/issues/3213
@NKGS i don't why but i had to explicit set the type
of the Icon to fix this issue
<Icon active name="eye" type="Ionicons"/>
@padupuy makes sense. The Icon
component expects a type, and my guess here is that the wrong icon is returned when the type
is not set because it falls back to a default value:
IconNB.propTypes = {
type: PropTypes.oneOf([
'AntDesign',
'Entypo',
'EvilIcons',
'Feather',
'FontAwesome',
'FontAwesome5',
'Foundation',
'Ionicons',
'MaterialCommunityIcons',
'MaterialIcons',
'Octicons',
'SimpleLineIcons',
'Zocial'
])
};
interface Icon extends Testable {
name?: string;
type?: "AntDesign" | "Entypo" | "EvilIcons" | "Feather" | "FontAwesome" | "FontAwesome5" | "Foundation" | "Ionicons" | "MaterialCommunityIcons" | "MaterialIcons" | "Octicons" | "SimpleLineIcons" | "Zocial";
// TODO position attribute of ReactNative.FlexStyle hasn't another position values without "absolute" and "relative"
style?: any;
onPress?: (e?: any) => any;
active?: boolean;
ios?: string;
android?: string;
color?: string;
fontSize?: number;
}
Seems related to #3213
Yes I suppose. As today i updated nativebase library in working project where Icons were perfect. As soon as I updated nativebase library few icons disappeared.
Few fonts like IonIcons, Fontisto and few others are not getting displayed.
@padupuy, @theberbie I have modified my code and added type property in all Icon tag still this issue prevail.
Hi @NKGS , can you provide minimal code reproduction on snack for the same.
<Icon active name="eye" type="Ionicons"/>
<Icon active name="eye-off" />
I faced a similar issue on Android after updating to version 7.0.0 of react-native-vector-icons. I noticed that the actual font assets in my app bundle had not changed, so I wound up copying the font files manually from node_modules/react-native-vector-icons/Fonts
to android/app/src/main/assets/
.
After that I cleaned my Android build with cd android && ./gradlew clean
and then re-ran my project. All of the icons were fixed.
This is a frustrating issue to deal with but I don't think its related to Native Base. Hope my solution helps.
Same problem
Hey I think we may have found a solution, if people are still facing the issue, can they checkout the comments here #3262 ?
Basically we had to follow the manual linking process of react-native-vector-icons for both iso and android. Going from v7< to v7> requires some cleaning of the dev environment.
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.
I faced a similar issue on Android after updating to version 7.0.0 of react-native-vector-icons. I noticed that the actual font assets in my app bundle had not changed, so I wound up copying the font files manually from
node_modules/react-native-vector-icons/Fonts
toandroid/app/src/main/assets/
.After that I cleaned my Android build with
cd android && ./gradlew clean
and then re-ran my project. All of the icons were fixed.This is a frustrating issue to deal with but I don't think its related to Native Base. Hope my solution helps.
This worked for me!
I faced a similar issue on Android after updating to version 7.0.0 of react-native-vector-icons. I noticed that the actual font assets in my app bundle had not changed, so I wound up copying the font files manually from
node_modules/react-native-vector-icons/Fonts
toandroid/app/src/main/assets/
.After that I cleaned my Android build with
cd android && ./gradlew clean
and then re-ran my project. All of the icons were fixed.This is a frustrating issue to deal with but I don't think its related to Native Base. Hope my solution helps.
manually copying font files from node-modules did the trick. npm link
somehow doesn't link correctly, I guess
In below code you can see Icon used is eye and eye-off but actually app shows cart.Similar is the case for all other ICONS in app. This issue occured after i updated react-native to 0.63 version and also i upgraded nativebase to latest verions.
`InputGroup rounded error={this.props.loginPassword.length > 0 && !this.props.loginPasswordValid} success={this.props.loginPassword.length > 0 && this.props.loginPasswordValid}>
<Input value={this.props.loginPassword} placeholder='Passsword' secureTextEntry={this.props.secureTextEntry} onChangeText={(event) => this.props.handleInputChange('loginPassword', event)} />
<Icon active name={this.props.secureTextEntry ? 'eye-off' : 'eye'} onPress={() => this.props.toggleShowPassword()} />
</InputGroup`
Attaching screenshot of mobilescreen![screenshot-1597334117899](https://user-images.githubusercontent.com/39052061/90157584-880e3500-ddab-11ea-9941-1d9175387626.jpg)
package.json file: "native-base": "^2.13.13", "react": "16.13.1", "react-native": "0.63.2", "react-native-vector-icons": "^7.0.0"
react-native-config.js module.exports = { project: { ios: {}, android: {}, }, assets: ['./assets/fonts', './assets/icomoon'], };