【发布时间】：2016-08-07 10:03:45
【问题描述】：
我正在关注这个 github：https://github.com/corymsmith/react-native-icons 来学习如何在我的应用程序上放置一些图标！所以我照他们说的做了：
-包含在android/setting.gradle和android/app/build.gradle代码的不同部分。
-做register module (in MainActivity.java)，在我对应的MainActivity.Java中导入
-Copy the font files and .json 在我刚刚创建的目录资产中...
在我的 MainActivity.java 中粘贴 onCreate 和引用 .addPackage(new ReactNativeIcons(Arrays.asList(
new IconFont("typicons", "typicons.ttf")
我的电话也是<Icon
name='typicons|beer'
size={150}
color='#887700'
style={styles.beer}/>
这种风格
beer: {
width: 50,
height: 50,
margin: 5,
color: '#887700'
},
但我的应用程序在这个位置只显示一个红色方块。只是边框是红色的，里面是白色的……我没有错误。所以我忘记了什么吗？ 如果您有任何想法可以帮助我！ :) 这很奇怪：/
谢谢！
【问题讨论】：
-
据我所知，该库不再维护。我试图在我的项目中使用它们，我遇到了同样的问题。当我四处寻找答案时，我读到 react-native-icons 不再维护，所以我开始使用 react-native-vector-icons github.com/oblador/react-native-vector-icons 并且我对它们没有任何问题（目前）： )
-
我刚看到，这可能是原因...：/悲伤！是的，我现在正在寻找 react-native-vector-icons ，我尝试使用它！而且它看起来并不比 react-native-icon 更难......所以我们会看到:) 谢谢你的回答！
-
@Vikky 我们同意，我只需要做
npm install react-native-icons@latest --save并将字体的内容复制到 app/src/main/assets/fonts 。例如使用它：var Icon = require('react-native-vector-icons/FontAwesome')然后<Icon.Button name="facebook" backgroundColor="#3b5998" onPress={this.loginWithFacebook}> Login with Facebook </Icon.Button>....因为这不起作用...：/
-
你必须做
npm install react-native-vector-icons --save，然后rnpm link+我还必须将Fonts文件夹中的内容复制到android/app/src/main/assets/fonts（注意小写字体文件夹）。然后我像这样使用它var Icon = require('react-native-vector-icons/FontAwesome'); var myIcon = (<Icon name="rocket" size={30} color="#900" />)和 ofc 在渲染器内部用{myIcon}调用它。我试过 Icon.Button 它对我有用，我会在下一条评论中粘贴你的代码 -
短版代码：
import Icon from "react-native-vector-icons/FontAwesome"; const myIcon = (<Icon name="pencil-square-o" size={18} color="#F5FCFF"/>); class Navbar extends Component { render() { var myButton = ( <Icon.Button name="facebook" backgroundColor="#3b5998" onPress={this.loginWithFacebook}> Login with Facebook </Icon.Button> ); return ( <View> <Text>{myIcon} To Do</Text>{myButton} </View> ); } } export default Navbar;
标签： reactjs react-native font-awesome