react-native-vector-icons的使用 X图标出不来

步骤一:

yarn add react-native-vector-icons
react-native link react-native-vector-icons

步骤二:

找到要引用图标于图标所在模块
图标库查询https://oblador.github.io/react-native-vector-icons/

image.png

步骤三:

引入需要的模块,比如

import AntDesign from 'react-native-vector-icons/AntDesign'
import Ionicons from 'react-native-vector-icons/Ionicons'
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'

//图标房子
<AntDesign name="home" size={13} color={#FF0000} />
//图标通知
<Ionicons name="ios-notifications-outline" size={13} color={#ff0000} />

步骤四

android/app/build.gradle文件,添加如下内容:(不添加这块内容会导致图标不能显示,显示X)

project.ext.vectoricons = [
    iconFontNames: [ 'MaterialIcons.ttf', 'EvilIcons.ttf' ]
]
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

这样就可以了

image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。