Categories
accessibilità boilerplate solution linguaggio javascript React Navigation

Starter

React Native ha pochi template o boilerplate solution. Può essere utile aggiungere una ulteriorie interfaccia da linea di comando chiamata rn-cli (ma non sostituisce react-native cli).

Ci installa anche molte librerie utili.

Categories
iOS React Native

React Native con iOS (1)

Per provare a compilare ed eseguire un progetto React Native su iPhone/iOS (è obbligatorio possedere anche un macOS) si devono usare due comandi sul terminale (il secondo aprirà il simulatore).

Questo è il primo dei comandi sul terminale di macOS:

Categories
button component JSX React Native stile

Stile per bottone

Grazie allo stile (simile al CSS) si può facilmente posizionare un’area di testo ovunque nella schermata di React Native, ma posizionare un bottone è meno intuitivo.

Categories
accessibilità React Native

Accessibilità

Per le persone non vedenti, Android usa TalkBack, mentre iOS usa VoiceOver. React Native permette di accedere alle loro funzioni, con approcci leggermenti diversi.

Categories
component React Native react-native-vision-camera

Fotocamera 3

In un precedente articolo1 si è semplicemente aperta la schermata della fotocamera, ora si aggiungerà un pulsante per attivare lo scatto (e il flash).

  1. https://www.cancellino.org/2023/02/fotocamera-2/ []
Categories
hooks React react-native-vision-camera

Ref Hooks

Dopo aver visto Context e State1 , per usare alcune funzioni della fotocamera è utile vedere anche Ref Hooks. Si usa in modo simile a State, ma senza far ripetere il rendering.

  1. https://www.cancellino.org/category/linguaggio/javascript/react/hooks/ []
Categories
async React Native react-native-vision-camera

Fotocamera (2)

Nel precedente post1 si è installata la libreria per usare la fotocamera e si è corretto un bug durante la compilazione. Ora si attiveranno i permessi e si aprirà la fotocamera (posta sul retro).

  1. https://www.cancellino.org/2023/02/fotocamera/ []
Categories
Android React Native react-native-vision-camera

Fotocamera

In questo articolo si sperimenta una libreria per usare la fotocamera con React Native.

Non è una libreria ufficiale, quindi in futuro ve ne potrebbero essere altre. In questo articolo si compila il primo programma (senza ancora aprire la fotocamera)

Categories
React Navigation

React Navigation 2

Nel precedente post si è costruita una App composta da due schermate.

  • Un component con proprietà .Screen si occupa solo di una schermata
  • Un component con proprietà .Navigator si occupa di tutte le schermate
Categories
debug linguaggio javascript npm React Native

Debug con log

Il debug in React è facile, in quanto in caso di errori appaiono i numeri delle righe del codice sorgente. In React Native è un incubo.