Implement getImageSource

[jakex7]

Why

Fixes #26 Since expo-font now supports rendering glyphs to images using Font.renderToImageAsync (https://github.com/expo/expo/pull/36185), we can implement support for getImageSource with the same interface as react-native-vector-icons https://github.com/oblador/react-native-vector-icons#static-methods

How

Implemented static method getImageSource on Icon component.

Test Plan

import { FontAwesome } from "@expo/vector-icons";
import { useState } from "react";
import { Button, Image, PlatformColor, StyleSheet, View } from "react-native";

export default function App() {
  const [img, setImg] = useState("");
  return (
    <View style={styles.container}>
      <FontAwesome name="home" size={24} color={PlatformColor("systemRed")} />
      <Button
        title="Click Me"
        onPress={async () => {
          const image = await FontAwesome.getImageSource(
            "home",
            200,
            PlatformColor("systemBlue"),
          ).catch((e) => console.warn(e));
          console.log(image);
          if (image) setImg(image);
        }}
      />

      {img && (
        <Image source={{ uri: img }} style={{ width: 200, height: 200 }} />
      )}
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
});

Results: LOG file:///Users/jakubgrzywacz/Library/Developer/CoreSimulator/Devices/68321A76-B7B0-427D-A714-E44443E8FD01/data/Containers/Data/Application/5DC40FC3-7740-42A0-BE98-00356838C77B/tmp/F96326C7-B585-4EDB-995B-5B2CEFDFC8EC.png

[linear[bot]]

ENG-14287 Add function to expo-font for extracting an image from a font glyph

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
vector-icons	✅ Ready (Inspect)	Visit Preview	Apr 23, 2025 1:04pm

[Ladvace]

when is this planned to be released?

[thespacemanatee]

@lukmccall this is already merged, can we just get a new release out? This is blocking us from using the amazing https://github.com/callstackincubator/react-native-bottom-tabs library.