Functions & Hooks

useFonts

function useFonts(families: Record<string, FontSource[]>): boolean;

Register fonts for the lifetime of a component and report when they are in.

Renders once with false, then once more with true. Text drawn before the faces land uses the platform fallback, so gate on the return value when that would be visible:

const ready = useFonts({ Playfair: [require('./Playfair-Regular.ttf')] })
return <Canvas>{ready && <Text fontFamily="Playfair" ... />}</Canvas>

A load failure leaves this false forever; use useFontsState to see it.

Parameters

families

Record<string, FontSource[]>

Returns

boolean

On this page