在 Expo 中添加自定义图标

Question

我正在使用本机基础库，我想添加我制作的自定义图标。我找到了一些像这样的答案，但所有答案都是针对本机反应的，我必须从 Expo 导出我的文件以编辑 android 和 ios 文件夹。

Answer 1

在Expo中可以通过三种方式创建自定义图标。我会告诉你其中一个。请参阅 官方文档的其余部分。

Returns 您自己的基于 glyphMap 的自定义字体，其中键是图标名称，值是 UTF-8 字符或其字符代码。 fontFamily 是字体名称而不是 filename。 expoAssetId 可以是您可以传递给 Font.loadAsync 的任何内容。有关详细信息，请参阅 react-native-vector-icons。

例子

import * as React from 'react';
import * as Font from 'expo-font';
import { createIconSet } from '@expo/vector-icons';

const glyphMap = { 'icon-name': 1234, test: '∆' };
const expoAssetId = require("assets/fonts/custom-icon-font.ttf");
const CustomIcon = createIconSet(glyphMap, 'FontName', expoAssetId);

export default class CustomIconExample extends React.Component {  
  render() {
    return (
      <CustomIcon name="icon-name" size={32} color="red" />
    );
  }
}

有用的链接： Documents for the Custom Icon

在 Expo 中添加自定义图标

Add custom icons in Expo

react-native

icons

expo

native-base