[英]Icons are not appearing in react-native
I am using react-native-vector-icons/FontAwesome
to show icons and react-navigation
for showing tabs.我正在使用
react-native-vector-icons/FontAwesome
来显示图标和react-navigation
来显示选项卡。 I am trying to show Home icon in button navigation but icons are not appearing.我试图在按钮导航中显示主页图标,但图标没有出现。
PFB relevant code of Icon and createBottomTabNavigator
Icon和
createBottomTabNavigator
的PFB相关代码
import React from 'react';
import { createBottomTabNavigator } from 'react-navigation';
// import { Icon } from 'react-native-elements';
import Icon from 'react-native-vector-icons/FontAwesome';
import Account from '../../Form/components/Account';
import Home from '../../Layout/components/Home';
export const Tabs = createBottomTabNavigator({
Account: {
screen: Account,
navigationOptions: {
tabBarLabel: 'Account',
tabBarIcon: ({ tintColor }) => <Icon name="rocket" size={35} color="#fdc94c" />
}
},
Home: {
screen: Home,
navigationOptions: {
tabBarLabel: 'Home',
tabBarIcon: ({ tintColor }) => <Icon name="rocket" size={35} color="#fdc94c" />
},
}
}, {
order: ['Home', 'Account'],
tabBarOptions: {
showLabel: true,
showIcon: true,
activeBackgroundColor: '#42a5f5',
style: {
backgroundColor: '#42a5f5',
paddingVertical: 10,
height: 60
},
indicatorStyle: {
backgroundColor: '#42a5f5',
}
}
})
PFB screenshot as well. PFB 截图也是如此。
Make sure that the font is linked in your iOS workspace, by using react-native link react-native-vector-icons
then rebuild the app通过使用
react-native link react-native-vector-icons
确保字体已链接到您的 iOS 工作区,然后重建应用程序
Follow the documentation and make sure that everything is set as they mentioned https://github.com/oblador/react-native-vector-icons#ios按照文档并确保按照他们提到的那样设置所有内容https://github.com/oblador/react-native-vector-icons#ios
Run command npm i -g rnpm.运行命令 npm i -g rnpm。 And run the rnpm link on project folder.
并在项目文件夹上运行 rnpm 链接。 Then run the project.
然后运行项目。
Run the following command in your project folder.在您的项目文件夹中运行以下命令。
$react-native link $react-native 链接
您是否已将其粘贴到应用级别 gradle android\app\build.gradle
?
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.