Temi, font e immagini

Temi di colore

colorMode accetta light o dark. Fornire un parziale customTheme per ignorare i token; il binding lo fonde in profondità con il tema incorporato selezionato. Un'applicazione può risolvere il dispositivo preferenza con React Native useColorScheme e passare la modalità risultante.

Code
<FormRenderer schema={schema} colorMode="dark" customTheme={{ color: { primary: "#7c3aed" } }} />

lightTheme, darkTheme, mergeThemes e getThemeByName vengono esportati a livello di applicazione ThemeProvider e useTheme possono mantenere l'interfaccia utente nativa circostante allineata con la forma.

Caratteri confezionati

Il pacchetto esporta le sue attività Figtree attraverso form0Fonts. In Expo, caricarle a richiesta avvio prima di eseguire il rendering del modulo:

Code
import { useFonts } from "expo-font"
import { form0Fonts, FormRenderer } from "form0-react-native"

const [fontsLoaded] = useFonts(form0Fonts)
if (!fontsLoaded) return null

return <FormRenderer schema={schema} />

Immagini di supporto

I percorsi HTTP e HTTPS remoti si risolvono in { uri } per impostazione predefinita. React Native richiede il raggruppamento locale immagini da scoprire staticamente, in modo da fornire un imageResolver che mappa i percorsi schema a sorgenti di immagini importate o richieste:

Code
const images = {
  "safety/helmet.png": require("./assets/safety/helmet.png"),
}

<FormRenderer schema={schema} imageResolver={(path) => images[path] ?? null} />

La Expo starter mantenuta genera questa mappatura quando le risorse di supporto-immagine cambiano.