在Expo中添加自定义图标

Question

I am using the native base library and i want to add a custom Icon i made. I found some answers like this one , but all answers are for react native and i have to export my files from Expo to edit the android and ios folders.

Answer 1

There are three ways to create a custom icon in Expo . I'll tell you one of them. See the rest of the official documents .

Returns your own custom font based on the glyphMap where the key is the icon name and the value is either a UTF-8 character or it's character code. fontFamily is the name of the font NOT the filename . The expoAssetId can be anything that you can pass in to Font.loadAsync . See react-native-vector-icons for more details.

Example

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" />
    );
  }
}

Useful Links: Documents for the Custom Icon