扩展包作用

提供各种图标
github地址:react-native-vector-icons

安装

1. npmyarn安装

#npm
npm install --save react-native-vector-icons
#yarn
yarn add react-native-vector-icons

2. Android中使用

在编译时,可选择自动加载静态文件,也可手动添加

自动打包

android/app/build.gradle添加以下代码,以便在编译应用是打包字体文件:

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

由于此包包含了多个图标字体文件,可以选择性打包指定的一个或多个字体文件:

project.ext.vectoricons = [
    iconFontNames: [ 'MaterialIcons.ttf', 'EvilIcons.ttf' ] // Name of the font files you want to copy
]

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

手动拷贝静态资源(略)

3. 建立连接

react-native link

在组件中使用

import Icon from 'react-native-vector-icons/FontAwesome';
const myIcon = <Icon name="rocket" size={30} color="#900" />;
Last modification:March 2nd, 2020 at 03:18 pm