1
00:00:02,520 --> 00:00:08,550
Prima di continuare con il processo di compilazione o pubblicazione e quindi portarlo negli app

2
00:00:08,550 --> 00:00:10,300
store, continuiamo a configurarlo.

3
00:00:10,300 --> 00:00:15,330
Ora per uno, ci sono alcuni spazi vuoti qui come la descrizione che manca e che

4
00:00:15,330 --> 00:00:16,440
potresti aggiungere aggiungendo

5
00:00:16,440 --> 00:00:21,540
una chiave di descrizione qui con del testo e quella sarebbe la descrizione che appare qui.

6
00:00:21,660 --> 00:00:24,640
Importante, non è una descrizione che appare negli

7
00:00:24,640 --> 00:00:28,950
app store, è davvero solo una descrizione che appare qui e puoi

8
00:00:28,950 --> 00:00:34,200
saperne di più sulla descrizione, tutti gli altri tasti che puoi impostare qui in questa pagina.

9
00:00:34,230 --> 00:00:37,110
Dopotutto ci sono molte impostazioni che puoi configurare.

10
00:00:37,110 --> 00:00:42,780
Ora quello che mi interessa in questo momento è l'icona e la parte della schermata iniziale perché è l'icona che

11
00:00:42,780 --> 00:00:44,610
le persone vedranno nella schermata principale,

12
00:00:44,610 --> 00:00:49,920
ovviamente non ancora perché in questo momento non stiamo pubblicando le app sull'App Store ma ciò cambierà e

13
00:00:50,700 --> 00:00:51,670
la schermata iniziale,

14
00:00:51,690 --> 00:00:54,140
questo è ciò che gli utenti vedono quando

15
00:00:54,330 --> 00:00:58,620
la nostra app viene caricata ed entrambi sono elementi che in genere si desidera personalizzare.

16
00:00:58,680 --> 00:01:05,810
Ora expo ti dà un'icona e una schermata iniziale pronta all'uso, ma entrambi sono solo segnaposto vuoto, giusto,

17
00:01:05,820 --> 00:01:08,720
quindi non è troppo sorprendente, invece vogliamo

18
00:01:08,730 --> 00:01:12,590
fornire la nostra icona, la nostra immagine schermata iniziale qui.

19
00:01:12,600 --> 00:01:17,850
Ora sei davvero flessibile riguardo a ciò che fornisci qui, ma in generale, è

20
00:01:17,850 --> 00:01:22,840
una buona idea fornire un'icona nella risoluzione 1024 x 1024, quindi un'icona quadrata

21
00:01:22,890 --> 00:01:30,720
come input e per la schermata iniziale, puoi creare una schermata iniziale come descritto nei documenti ufficiali in cui è

22
00:01:30,720 --> 00:01:35,550
possibile saperne di più su come è possibile creare una schermata iniziale,

23
00:01:35,550 --> 00:01:38,520
come è possibile strutturarla e così via.

24
00:01:38,520 --> 00:01:45,600
Ora ho preparato qualcosa per te che puoi usare per seguire ora che non dovresti usare per una distribuzione reale perché

25
00:01:45,660 --> 00:01:51,930
queste risorse sono solo per questo corso, non per te da usare nella tua app che prevedi di distribuire

26
00:01:51,930 --> 00:01:57,870
e per quella allegata che trovi le icone. file zip.

27
00:01:58,000 --> 00:02:04,270
Ora, se decomprimilo, troverai un posto. file png che puoi ovviamente trascinare e rilasciare nella

28
00:02:04,270 --> 00:02:05,500
cartella delle

29
00:02:05,500 --> 00:02:08,840
risorse, puoi anche eliminare l'icona. file png lì se vuoi.

30
00:02:08,890 --> 00:02:15,460
Puoi anche eliminare lo splash. file png perché in questa cartella allegata troverai

31
00:02:15,580 --> 00:02:19,720
anche questa icona splash. file png che puoi ovviamente trascinare e rilasciare qui.

32
00:02:19,720 --> 00:02:24,030
Ora queste sono solo alcune icone che ho creato che possiamo usare

33
00:02:24,280 --> 00:02:29,590
ora e indietro nell'app. file json, ora possiamo puntare alle icone personalizzate. Importante, dovresti fornire file

34
00:02:29,600 --> 00:02:31,720
png mentre lo sto facendo qui.

35
00:02:31,720 --> 00:02:38,170
Quindi ora per l'icona, possiamo puntare su risorse / luoghi. png e per lo splash, possiamo

36
00:02:38,260 --> 00:02:46,840
indicare che assets / splash_icon. png. Ora come colore di sfondo, lì possiamo usare

37
00:02:46,840 --> 00:02:47,940
un colore nero

38
00:02:48,010 --> 00:02:55,180
scuro come il codice esadecimale # 171717, questo dovrebbe essere un colore del codice esadecimale come questo e la modalità di ridimensionamento qui

39
00:02:55,180 --> 00:03:00,610
può essere impostata per contenere o coprire, la copertura allungherà sostanzialmente l'icona per prendere la larghezza e

40
00:03:00,610 --> 00:03:06,190
l'altezza disponibili, contengono, manterranno la dimensione dell'icona, la centreranno e avranno quel colore di sfondo dietro l'icona.

41
00:03:06,190 --> 00:03:10,090
Ora, se lo facciamo, possiamo già vedere il risultato di questo se

42
00:03:10,240 --> 00:03:18,730
solo npm lo avviamo, quindi il server, come abbiamo fatto molte volte in questo corso o expo, si avvia e poi lo lanciamo di nuovo su

43
00:03:18,730 --> 00:03:26,010
un emulatore, Android o iOS mentre io lo sto facendo qui. Ora questo lo lancia lì e ora vedi, questa è la schermata iniziale

44
00:03:26,200 --> 00:03:31,510
che ne sta già prendendo una nuova, con l'immagine lì dentro che è la nostra grande ma che è apposta

45
00:03:31,520 --> 00:03:35,920
in modo che possiamo vederla chiaramente e il colore di sfondo che è leggermente diverso quindi che

46
00:03:35,920 --> 00:03:40,180
hai anche la possibilità di vedere che, ovviamente, potresti scegliere lo stesso colore per avere una

47
00:03:40,180 --> 00:03:42,480
schermata di avvio senza soluzione di continuità qui.

48
00:03:42,520 --> 00:03:45,510
Quindi funziona e aspettiamo che finisca, ecco l'app

49
00:03:45,710 --> 00:03:50,160
in esecuzione e ora vedi anche la tua icona qui se

50
00:03:50,170 --> 00:03:55,240
vai nel selettore di attività. Vedi che non è così bello con lo

51
00:03:55,240 --> 00:03:56,720
sfondo ma è qualcosa che

52
00:03:56,740 --> 00:04:02,740
possiamo migliorare, ma qui è l'icona in generale, quindi funziona, vediamo sia la schermata iniziale che l'icona e su

53
00:04:02,770 --> 00:04:05,610
iOS sarebbe la stessa. Ora, come puoi dire,

54
00:04:05,610 --> 00:04:08,230
l'icona non è così bella su Android però.

55
00:04:08,250 --> 00:04:13,260
Il motivo è che Android, a seconda della versione di Android in esecuzione sul dispositivo,

56
00:04:13,650 --> 00:04:20,310
utilizza icone diverse, le versioni più recenti e più recenti di Android utilizzano queste cosiddette icone adattive che sono queste icone

57
00:04:20,310 --> 00:04:25,980
arrotondate in cui hai la tua icona nel mezzo e poi un po 'di colore di sfondo o

58
00:04:25,980 --> 00:04:28,060
un'immagine di sfondo anche dietro

59
00:04:28,110 --> 00:04:30,900
di loro, le versioni precedenti avrebbero usato icone quadrate.

60
00:04:30,900 --> 00:04:38,930
Ora puoi provvedere a questo fornendo una configurazione più dettagliata per Android e anche

61
00:04:39,000 --> 00:04:45,770
per iOS, se lo desideri. Invece di avere questa chiave icona generale qui, puoi configurare impostazioni specifiche della piattaforma

62
00:04:45,770 --> 00:04:48,800
ed è anche qualcosa che hai imparato nei documenti ufficiali ovviamente.

63
00:04:48,870 --> 00:04:55,380
Qui puoi trovare informazioni su come configurare splash icona, che è bello, ma

64
00:04:55,380 --> 00:05:01,150
anche su come puoi configurare iOS in un modo specifico

65
00:05:01,260 --> 00:05:07,310
e lì puoi impostare un'icona specifica per iOS se vuoi usarlo.

66
00:05:07,480 --> 00:05:13,710
Naturalmente lo stesso vale per la schermata iniziale, quindi puoi sostanzialmente aggiungere un nodo iOS alla tua

67
00:05:13,720 --> 00:05:21,910
configurazione, lo abbiamo già qui anche qui e dentro, potresti anche aggiungere un'icona e quindi anche una configurazione iniziale che sembra esattamente

68
00:05:21,910 --> 00:05:27,450
o che assomiglierebbe esattamente alla configurazione di root che abbiamo qui, ma ora potresti

69
00:05:27,520 --> 00:05:33,730
sostanzialmente scavalcare queste impostazioni di livello di root generali e avere un'icona specifica per iOS e

70
00:05:33,730 --> 00:05:36,170
una schermata iniziale specifica per iOS.

71
00:05:36,190 --> 00:05:41,620
Quindi è qualcosa che potresti fare e lo stesso vale per Android e ovviamente lo trovi anche

72
00:05:41,620 --> 00:05:42,820
nei documenti ufficiali.

73
00:05:43,000 --> 00:05:49,050
Puoi aggiungere una chiave Android qui alla tua app. file json e quindi questo contiene un oggetto

74
00:05:49,060 --> 00:05:55,780
per così dire, lì puoi anche impostare un'icona e una configurazione splash proprio come l'ho spiegato per iOS

75
00:05:55,840 --> 00:05:58,900
e ora queste impostazioni verrebbero prese per Android,

76
00:05:59,140 --> 00:06:04,120
iOS poiché non ha impostazioni specifiche nel mio esempio qui userei ancora le impostazioni

77
00:06:04,120 --> 00:06:05,190
generali lassù.

78
00:06:05,200 --> 00:06:10,690
Ora la cosa interessante è per Android, non puoi semplicemente impostare una schermata iniziale

79
00:06:10,780 --> 00:06:18,580
specifica per le icone, puoi anche impostare un'icona adattiva qui con la configurazione dell'icona adattiva, che non è disponibile per iOS

80
00:06:18,580 --> 00:06:21,820
perché le icone adattive sono esclusive di Android.

81
00:06:21,820 --> 00:06:29,450
L'icona adattiva accetta un oggetto Javascript, per così dire come un valore di configurazione, non una stringa e questo oggetto

82
00:06:29,680 --> 00:06:35,950
può avere tre chiavi: un'immagine in primo piano, un colore di sfondo o un'immagine di sfondo.

83
00:06:35,950 --> 00:06:40,960
Ora hai un colore di sfondo o un'immagine di sfondo ma dovresti sempre avere un'immagine in

84
00:06:40,960 --> 00:06:41,850
primo piano.

85
00:06:41,890 --> 00:06:46,780
Ora qui possiamo aggiungere l'immagine di primo piano, quindi questa chiave qui e

86
00:06:46,780 --> 00:06:53,410
il colore di sfondo che dovrebbe essere un codice esadecimale a sei cifre come puoi vedere e facciamolo rapidamente

87
00:06:53,520 --> 00:06:59,590
qui e ora possiamo impostare il colore di sfondo per dire che il codice # 171717 e

88
00:06:59,590 --> 00:07:04,750
il l'immagine in primo piano ora può essere impostata sulla nostra icona, anche se

89
00:07:04,750 --> 00:07:07,900
per questo ti consiglio di utilizzare un'icona specifica che

90
00:07:08,020 --> 00:07:16,990
trovi anche allegata qui, i luoghi adattivi. file png che puoi trascinare e rilasciare nella cartella delle risorse e che si adatta ai luoghi. il file png ora può essere usato

91
00:07:17,410 --> 00:07:23,800
qui come immagine di primo piano, in modo che possiamo puntare su risorse e quindi adattarsi

92
00:07:23,830 --> 00:07:25,630
ai luoghi. png.

93
00:07:25,690 --> 00:07:30,550
Ora questa icona, l'icona adattiva i luoghi è trasparente, è ancora l'icona ma ha uno

94
00:07:30,550 --> 00:07:34,990
sfondo trasparente, a differenza dell'altra icona e che quindi consentirà ad Android di

95
00:07:34,990 --> 00:07:39,640
posizionarlo davanti a questo colore di sfondo o immagine di sfondo che hai fornito

96
00:07:39,640 --> 00:07:43,650
e automaticamente dietro gli angoli per te e così via.

97
00:07:43,660 --> 00:07:51,400
Quindi, se ora salviamo questo e questo quindi ricostruisce e per sicurezza che ne tenga davvero conto, riavvierò

98
00:07:51,430 --> 00:07:53,910
il mio server expo qui.

99
00:07:54,040 --> 00:08:00,370
Se ora lanciamo questo su Android e per questo chiuderò anche qui il client expo e

100
00:08:03,390 --> 00:08:05,490
quindi eseguirò nuovamente questo

101
00:08:05,490 --> 00:08:08,990
su Android, dovremmo vedere che una volta riavviato, ora

102
00:08:09,000 --> 00:08:12,540
abbiamo un'icona più bella che sembra un po 'meglio.

103
00:08:12,600 --> 00:08:14,060
Quindi aspettiamo che si

104
00:08:14,070 --> 00:08:19,560
avvii, questa è ancora la schermata iniziale come l'abbiamo configurata in precedenza, inoltre non ho impostato una schermata iniziale specifica per

105
00:08:19,560 --> 00:08:21,700
Android che ovviamente potremmo, ma qui non l'ho

106
00:08:21,720 --> 00:08:25,810
fatto, quindi ovviamente abbiamo ottenuto lo stesso schermata iniziale come in questo modulo e se

107
00:08:26,110 --> 00:08:31,440
ora dai un'occhiata all'icona, sfortunatamente potresti ancora vedere quella vecchia. Il nuovo verrà preso in considerazione

108
00:08:31,440 --> 00:08:37,320
anche se una volta creata questa app come app autonoma e distribuita agli app store.

109
00:08:38,100 --> 00:08:43,110
In generale, la raccomandazione è che per Android, imposti un'icona così adattiva perché copri più

110
00:08:43,110 --> 00:08:49,470
versioni di Android che ovviamente non fanno male. Anche l'impostazione di un'icona così generale non è una cattiva idea

111
00:08:49,470 --> 00:08:50,040
e,

112
00:08:50,070 --> 00:08:54,780
naturalmente, possiamo usare la stessa icona sia per iOS che per Android oppure impostare icone specifiche per

113
00:08:54,810 --> 00:09:01,110
iOS e per Android, come probabilmente indicato per Android, l'icona adattiva. Se vuoi saperne di più sul processo di

114
00:09:01,110 --> 00:09:06,180
creazione e gestione delle icone e delle schermate iniziali, in allegato troverai i documenti ufficiali

115
00:09:06,180 --> 00:09:11,160
dell'esposizione che approfondiscono le diverse opzioni che hai lì e ciò che dovresti considerare.