1
00:00:02,190 --> 00:00:07,460
Ora hai imparato come aggiungere caratteri a un'applicazione e in allegato, troverai un file zip con i

2
00:00:07,470 --> 00:00:10,000
caratteri che voglio aggiungere. Per quello nella cartella delle

3
00:00:10,020 --> 00:00:16,290
risorse, aggiungerò una nuova cartella di caratteri e poi sarà OpenSans-Bold e regolare. il file ttf che si trova nel file zip

4
00:00:16,290 --> 00:00:19,350
che trovi allegato che voglio aggiungere qui.

5
00:00:19,470 --> 00:00:22,670
Ora aggiungere i file da soli non farà molto come sapete, invece

6
00:00:22,710 --> 00:00:27,690
dobbiamo caricare questi caratteri e lo facciamo nell'app. js file che è il nostro file iniziale

7
00:00:27,690 --> 00:00:31,070
che avvia l'intera app. Lì, dobbiamo importare

8
00:00:31,170 --> 00:00:36,660
tutto come font da expo-font e questo potrebbe non essere ancora disponibile

9
00:00:36,660 --> 00:00:43,320
nel tuo progetto, quindi potresti voler eseguire npm install --save expo-font per essere sicuro che

10
00:00:43,320 --> 00:00:45,010
sia disponibile, per

11
00:00:45,030 --> 00:00:52,530
installarlo pacchetto e con quello installato, puoi importare font da lì, in questo modo e voglio anche

12
00:00:52,620 --> 00:00:54,750
importare il componente di caricamento

13
00:00:54,750 --> 00:01:02,910
dell'app da expo, che è il componente che prolungherà la schermata iniziale quando l'app si avvia fino a quando

14
00:01:02,910 --> 00:01:09,000
i nostri font non vengono caricati in modo che solo noi vedere qualcosa sullo

15
00:01:09,000 --> 00:01:14,670
schermo quando tutte le nostre risorse, e in questo caso questi sono

16
00:01:14,700 --> 00:01:22,950
i caratteri, sono davvero disponibili e ci sono davvero. Ora con queste importazioni aggiunte, possiamo aggiungere una funzione

17
00:01:23,250 --> 00:01:25,130
qui al di

18
00:01:25,310 --> 00:01:30,180
fuori della nostra funzione componente che chiamerò fetch fonts e questa

19
00:01:30,600 --> 00:01:39,190
è una funzione che alla fine utilizzerà font, quindi quello che sto importando qui, caricherà asincrono e poi noi passiamo

20
00:01:39,190 --> 00:01:47,110
un oggetto in cui descriviamo i dati che vogliamo caricare e questo è il carattere open sans che

21
00:01:47,110 --> 00:01:57,890
registrerò sotto open sans, aggiungiamo questo richiedendolo da. / assets / fonts / OpenSans, non grassetto ma regolare. ttf e poi in più, abbiamo

22
00:01:57,890 --> 00:02:05,470
open-sans-bold, questo è l'altro carattere che voglio registrare, richiedendolo da asset / fonts

23
00:02:05,470 --> 00:02:08,210
/ OpenSans-Bold. ttf, in questo modo.

24
00:02:08,440 --> 00:02:14,320
Ora dobbiamo restituirlo perché load async restituisce una promessa e voglio restituirlo nella mia funzione fetch fonts

25
00:02:14,320 --> 00:02:20,410
perché con questo, possiamo usarlo insieme al componente di caricamento dell'app e questo è uno schema che hai

26
00:02:20,410 --> 00:02:22,430
appreso in precedenza nel corso.

27
00:02:22,450 --> 00:02:23,970
Quindi, nel caso in cui

28
00:02:24,010 --> 00:02:28,040
questo sia nuovo di zecca, assicurati di passare prima attraverso le altre sezioni di questo corso.

29
00:02:28,060 --> 00:02:34,840
Quindi ora possiamo usare i font di recupero con il caricamento delle app e lo facciamo all'interno del nostro

30
00:02:34,840 --> 00:02:41,680
componente dell'app, lì, gestirò un po 'di stato e lo farò con l'aiuto del hook useState che importiamo da

31
00:02:42,610 --> 00:02:51,760
React e lo chiamerò font di stato caricato e set di font caricato e chiamata useState e inizialmente, questo è falso perché inizialmente, il font non

32
00:02:51,790 --> 00:02:54,260
è stato caricato e quindi qui,

33
00:02:54,400 --> 00:03:00,100
possiamo verificare se il font non è stato caricato che inizialmente è il caso, quindi voglio

34
00:03:00,100 --> 00:03:07,270
tornare il componente di caricamento dell'app invece del mio normale contenuto di app perché nel componente di caricamento dell'app, possiamo

35
00:03:07,600 --> 00:03:14,600
aggiungere la proprietà start async e puntare a recuperare i caratteri che danno il via a questa funzione di recupero

36
00:03:14,860 --> 00:03:21,430
dei caratteri e una volta fatto, la funzione che passiamo a onFinish sarà chiamato e in questa funzione,

37
00:03:21,430 --> 00:03:29,240
imposterò semplicemente il carattere caricato su true, in questo modo. Quindi questo ci assicura che manteniamo semplicemente aperta la schermata iniziale

38
00:03:29,240 --> 00:03:35,600
fino a quando non vengono caricati i nostri caratteri e questo verrà reso fino a quando non avremo ricaricato

39
00:03:35,840 --> 00:03:42,590
i nostri caratteri e, successivamente, caricheremo invece questo contenuto. Ora con ciò, ci stiamo assicurando che stiamo importando i nostri caratteri e che

40
00:03:42,590 --> 00:03:45,870
possiamo iniziare a usarli e ne avremo bisogno in tutto questo modulo.

41
00:03:45,980 --> 00:03:52,280
Con ciò, ora è il momento di iniziare con l'aggiunta effettiva di ciò per cui siamo venuti tutti, la navigazione.