在react-native項目中我們一般使用到 react-native-vector-icons（這里不介紹如何使用react-native-vector-icons按照官方文檔即可）但是當react-native-vector-icons里面的默認圖標并不能滿足我們的日常開發(fā)的時候怎么辦呢？
那就是只能使用自定義圖標來了，這里我們以iconfont為例，（其他圖標庫引入方式一模一樣）
一、在iconfont上選擇好你需要的圖標，下載并解壓如下：
image
二、將iconfont.tff文件拷貝到android/app/src/main/assets/fonts文件下
三、在你的根目錄下新建js/common/MyIcon.js和iconfont.json
編輯Myicon.js
import {createIconSet} from 'react-native-vector-icons';
import glyphMap from './iconfont.json';
const iconSet = createIconSet(glyphMap, 'MyIcon', 'iconfont.ttf');
export default iconSet;
編輯iconfont.json
{ "qiuchang": 59002 }
這里作如下說明，iconfont.json中對應圖標名字，和十進制碼，我們選擇的圖標有個Unicode編碼，他是十六進制的，而我們要將其轉(zhuǎn)換為十進制，配置在我們的iconfont.json中
image
四、使用
[
復制代碼
](javascript:void(0); "復制代碼")
<pre style="margin: 0px; padding: 0px; overflow: auto; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">import MyIcon from "../../common/CustomizeIcon";
..... <MyIcon name={'qiuchang'} size={50} style={{
color: '#f33' }}></MyIcon>
........</pre>
復制代碼
](javascript:void(0); "復制代碼")
