1
00:00:02,420 --> 00:00:08,930
Ora, con tutto ciò in questo modulo, hai imparato molto su come creare app reali con React Native.

2
00:00:08,930 --> 00:00:11,780
Hai imparato molto sui componenti integrati, hai imparato

3
00:00:11,780 --> 00:00:16,370
molto sullo stile e su come disporre le cose nel modo desiderato e

4
00:00:16,370 --> 00:00:17,300
come modellare

5
00:00:17,300 --> 00:00:24,290
le cose nel modo desiderato, anche in che modo lo stile differisce tra alcuni componenti, ad esempio che per i componenti

6
00:00:24,320 --> 00:00:26,320
di testo, lo stile arriva fino

7
00:00:26,390 --> 00:00:31,970
a un certo punto, quindi gli stili sono ereditati in stili nidificati lì, qualcosa di cui

8
00:00:31,970 --> 00:00:39,770
stiamo approfittando nel gioco sullo schermo qui, ma che su tutti gli altri componenti come la vista, gli stili che vi si applicano

9
00:00:39,770 --> 00:00:45,880
si applicano solo a quella vista e non si sovrappongono, non sono condivisi con nessuna vista figlio nidificata.

10
00:00:45,890 --> 00:00:52,010
Hai anche imparato come condividere stili comuni, ad esempio con componenti personalizzati, come il nostro testo del corpo che imposta

11
00:00:52,010 --> 00:00:58,100
una famiglia di caratteri generale in modo che possiamo usare il testo del corpo anziché il testo incorporato se vogliamo

12
00:00:58,130 --> 00:01:00,480
un testo con quella famiglia di caratteri.

13
00:01:00,590 --> 00:01:04,190
Naturalmente questo è un concetto che puoi usare per qualsiasi stile condiviso che desideri,

14
00:01:04,310 --> 00:01:09,980
come lo stiamo facendo anche per il tipo di carta, in cui abbiamo una vista prestilata per darci questo bel aspetto

15
00:01:10,010 --> 00:01:12,140
di carta con un po 'di ombra.

16
00:01:12,140 --> 00:01:17,450
Hai anche imparato come impostare alcuni temi con costanti che puoi importare in diversi file, sia per i

17
00:01:17,870 --> 00:01:23,990
colori qui o anche se ne hai bisogno, per gli stili di testo o per qualsiasi altro stile che desideri condividere

18
00:01:23,990 --> 00:01:29,630
tra i componenti in modo da non " non è necessario riscriverlo tutte le volte, utile soprattutto per i casi

19
00:01:29,630 --> 00:01:33,120
in cui non si desidera o in cui non è possibile creare

20
00:01:33,260 --> 00:01:36,070
componenti separati, ad esempio per la famiglia di caratteri.

21
00:01:36,250 --> 00:01:40,820
Quindi, se ciò non fosse possibile, il che nel caso dei colori sarebbe

22
00:01:40,820 --> 00:01:47,690
stato difficile perché abbiamo bisogno di colori in tutti i tipi di luoghi, tali stili condivisi o costanti condivise sono un

23
00:01:47,690 --> 00:01:53,420
ottimo modo e in generale, spero che tu abbia un'idea di come componi le interfacce utente con

24
00:01:53,450 --> 00:01:58,820
i componenti integrati e con i tuoi componenti personalizzati che poi si basano sui componenti integrati

25
00:01:58,820 --> 00:02:02,120
e come puoi quindi creare belle applicazioni React Native.

26
00:02:02,140 --> 00:02:07,390
Abbiamo dato un'occhiata ad alcuni componenti principali e quindi voglio anche darti un breve riepilogo di ciò

27
00:02:07,390 --> 00:02:09,710
che hai imparato su questi componenti qui.

28
00:02:09,760 --> 00:02:15,080
Probabilmente il componente più importante è la vista, che è un contenitore che avvolgi

29
00:02:15,100 --> 00:02:21,180
altri componenti per poi stenderli o per aggiungere determinati stili di contenitore, come ombre, bordi, colore di

30
00:02:21,190 --> 00:02:24,760
sfondo, cose del genere. Altrettanto importante è

31
00:02:24,760 --> 00:02:29,870
il componente di testo che usi per produrre il testo.

32
00:02:29,950 --> 00:02:36,130
Puoi anche annidare il testo nel testo in cui è anche condiviso uno stile e in generale puoi controllare

33
00:02:36,130 --> 00:02:41,980
come deve essere generato il testo, se dovrebbe avvolgere se stesso come predefinito o se dovrebbe solo produrre

34
00:02:41,980 --> 00:02:43,070
una o due

35
00:02:43,210 --> 00:02:49,450
righe ed è qui che il componente di testo ti aiuta davvero a fornire queste preziose informazioni ai tuoi utenti.

36
00:02:49,450 --> 00:02:53,860
Ora a volte non si desidera solo generare informazioni, ma anche recuperare informazioni e, per

37
00:02:53,860 --> 00:02:55,930
questo, l'inserimento di testo può essere utile.

38
00:02:55,930 --> 00:03:00,760
Ora ci approfondiremo nel recuperare l'input dell'utente più avanti nel corso, ma hai già dato una prima occhiata a

39
00:03:00,760 --> 00:03:05,290
come puoi modellarlo e come puoi configurarlo e come puoi assicurarti di ottenere l'input giusto e convalida l'input

40
00:03:05,320 --> 00:03:11,210
e stai davvero lavorando solo con l'input di cui hai bisogno. Ora parlando dell'input dell'utente, ovviamente il pulsante è anche

41
00:03:11,210 --> 00:03:14,230
un componente cruciale, sia il pulsante incorporato che il

42
00:03:14,330 --> 00:03:19,070
tuo pulsante che puoi costruire con i componenti tattili che sono anche molto importanti

43
00:03:19,130 --> 00:03:20,960
e nei casi in cui

44
00:03:20,960 --> 00:03:26,660
devi produrre elenchi di dati, hai appreso su FlatList e sulla vista di scorrimento in cui la

45
00:03:26,750 --> 00:03:32,270
differenza principale è che FlatList è ottimizzato per elenchi molto lunghi o elenchi in cui non sai

46
00:03:32,270 --> 00:03:35,790
davvero quanto tempo saranno ma che sono potenzialmente molto lunghi, mentre

47
00:03:35,930 --> 00:03:42,470
la vista di scorrimento è ottima per qualsiasi altro contenuto scorrevole che non sia infinitamente lungo, dove certamente andrai oltre

48
00:03:42,470 --> 00:03:48,410
i confini dello schermo ma non sarà troppo contenuto extra perché se tutto quel contenuto extra viene reso

49
00:03:48,410 --> 00:03:54,110
senza essere usato, senza che sia visibile a l'utente, quindi stai sprecando le prestazioni ed è qui

50
00:03:54,110 --> 00:03:54,860
che

51
00:03:54,920 --> 00:03:56,710
entra in gioco FlatList perché

52
00:03:56,780 --> 00:03:59,980
questo rende solo ciò che l'utente può davvero vedere.

53
00:04:00,020 --> 00:04:05,330
Parlando di ciò che l'utente può vedere, in questo modulo, hai anche imparato come aggiungere i tuoi caratteri personalizzati e

54
00:04:05,330 --> 00:04:08,770
a volte non hai bisogno di un carattere ma di un'immagine, hai

55
00:04:08,900 --> 00:04:14,580
anche imparato a farlo, come includere sia locale che di rete immagini e come puoi modellare queste immagini per apparire belle.

56
00:04:14,600 --> 00:04:20,240
A proposito di stile, per questo stiamo usando il foglio di stile che non è un componente

57
00:04:20,240 --> 00:04:22,130
ma una classe o un

58
00:04:22,130 --> 00:04:28,190
oggetto fornito da React Native e il vantaggio di usare questo foglio di stile non è solo che otterrai

59
00:04:28,190 --> 00:04:35,090
i tuoi stili dal codice jsx che vuoi rimanere relativamente snello, breve e conciso, ma che ottieni anche la convalida automatica

60
00:04:35,180 --> 00:04:41,110
dei tuoi stili e React Native ti dice quando stai usando uno stile in modo errato e che

61
00:04:41,150 --> 00:04:47,860
in futuro potresti anche ottenere ulteriori ottimizzazioni delle prestazioni. E con ciò, possiamo solo incoraggiarti a tenere presente

62
00:04:47,860 --> 00:04:48,810
questa sezione,

63
00:04:48,820 --> 00:04:55,540
magari ripassarla una seconda volta e usarla come base per i tuoi ulteriori progressi del corso in cui utilizzeremo tutti

64
00:04:55,540 --> 00:05:01,570
questi componenti con cui abbiamo lavorato, dove scriveremo di più stili, in cui costruiremo interfacce utente più complesse

65
00:05:01,570 --> 00:05:07,330
e in cui avrai davvero bisogno di questi concetti fondamentali che hai appreso nel secondo e in

66
00:05:07,330 --> 00:05:11,080
questo modulo del corso per poi creare incredibili applicazioni React Native.

67
00:05:11,080 --> 00:05:11,890
Quindi andiamo avanti.