如何在React Native项目中使用Font Awesome而不使用任何第三方库? [英] How to use Font Awesome in react native project without using any third party library?

问题描述

我想在我的Android本机项目中使用Font Awesome图标.

I want to use Font Awesome icons in my react-native project for android.

我想手动执行此操作，而不使用任何第三方库，例如react-native-vector-icons或其他.

I want to do it manually without using any third party library like react-native-vector-icons or others.

推荐答案

我正在为android和ios回答它

i am answering it for android And ios

下载字体真棒zip提取文件，复制fontawesome-webfont.ttf文件

download font awesome zip extract the files copy fontawesome-webfont.ttf file

1. 在项目目录中建立/assets/fonts/目录

将 fontawesome-webfont.ttf 粘贴到/assets/fonts/

将文件重命名为 fontawesome.ttf

添加

"rnpm": { "assets": [ "./assets/fonts/" ] } 插入 package.json 文件的末尾

"rnpm": { "assets": [ "./assets/fonts/" ] } into your end of package.json file like this

1. 在项目目录中的终端中运行react-native link命令

看到像这样的荡妇

rnpm-install info Linking assets to ios project
rnpm-install info Linking assets to android project
rnpm-install info Assets have been successfully linked to your project

1. 确保成功链接后再次运行react-native run-android命令

转到字体很棒的速查表

仅复制要应用于文本视图的图标的字符代码并粘贴

copy only the character code of the icon you want to apply to a text view and paste it

<Text style={{ fontFamily: 'fontawesome', fontSize: 20 }}>&#xf0a9;</Text>

应用样式fontFamily: 'fontawesome'

类似地，您也可以对其他矢量图标字体执行此操作，例如 ionicons

similarly you can do it for other vector icon fonts like ionicons

和其他未使用第三方库(例如react-native-vector-icons

and others without using third party library like react-native-vector-icons

这篇关于如何在React Native项目中使用Font Awesome而不使用任何第三方库?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！