1 00:00:02,310 --> 00:00:08,520 Quindi diamo uno stile a questi componenti lì e per questo, vogliamo applicare un certo stile ai componenti del testo. 2 00:00:09,120 --> 00:00:12,780 Il componente di testo supporta effettivamente la proprietà di stile, come è 3 00:00:12,780 --> 00:00:19,680 possibile verificare nei documenti ufficiali, ma il componente di testo in realtà supporta meno funzionalità di stile rispetto alla vista e quindi, 4 00:00:19,710 --> 00:00:20,610 lo avvolgerò 5 00:00:20,970 --> 00:00:26,030 in un altro componente di vista e questo è solo il componente di vista che stanno 6 00:00:26,040 --> 00:00:31,560 importando da React Native, questa è anche la parte che volevo dire con te ha solo un paio 7 00:00:31,560 --> 00:00:36,960 di componenti di base, ma ti porteranno molto lontano perché lavori sempre con visualizzazioni, pulsanti e testi. 8 00:00:37,530 --> 00:00:44,730 Quindi qui avvolgerò questo testo con il componente di visualizzazione di apertura e chiusura qui e ora qui, abbiamo più 9 00:00:44,730 --> 00:00:46,090 opzioni di stile. 10 00:00:46,290 --> 00:00:50,730 Ora di nuovo, non andrò qui per gli stili incorporati, ma 11 00:00:50,730 --> 00:00:54,000 aggiungere stili al foglio di stile, ad 12 00:00:54,210 --> 00:01:03,810 esempio potremmo nominare questo elemento dell'elenco ma il nome dipende da te e diciamo che qui vogliamo avere un riempimento di 10, forse 13 00:01:03,810 --> 00:01:17,750 diamo è un colore di sfondo di questo codice esadecimale grigio qui, dagli un colore del bordo nero e anche una larghezza del bordo di uno e ora assegniamo la voce di elenco 14 00:01:17,880 --> 00:01:25,720 come stile a questa vista facendo riferimento agli stili. listItem qui e con questo se salviamo 15 00:01:25,770 --> 00:01:34,380 questo, ora la nostra voce di elenco dovrebbe apparire un po 'meglio, impara React Native, 16 00:01:34,610 --> 00:01:39,620 ecco come appare. Ora probabilmente anche una certa spaziatura sarebbe piacevole, 17 00:01:39,620 --> 00:01:46,850 possiamo ottenere che con margine, il riempimento è spaziatura tra il bordo e il contenuto, il margine è spaziatura tra il bordo e il 18 00:01:46,850 --> 00:01:49,270 contenuto circostante, quindi gli altri elementi 19 00:01:49,280 --> 00:01:55,130 attorno ad esso e lì, potremmo aggiungere margine 10 per aggiungere un margine in tutte le direzioni, potremmo anche 20 00:01:55,460 --> 00:01:59,600 solo aggiungere un margine in alto o solo in fondo o ed è 21 00:01:59,720 --> 00:02:06,050 qualcosa che non esiste nei CSS, puoi aggiungere un margine verticale di 10 per avere un margine in alto e 22 00:02:06,050 --> 00:02:08,560 in basso ma non a sinistra e a 23 00:02:08,720 --> 00:02:15,770 destra e questo è un esempio di come questo si basa su CSS ma non è lo stesso perché il margine verticale non 24 00:02:15,860 --> 00:02:23,210 sarebbe una proprietà che hai in CSS, ce l'hai in React Native. Quindi, se ora lo salviamo 25 00:02:23,210 --> 00:02:29,840 e aggiungiamo imparare React Native qui, ora vedi che c'è 26 00:02:30,030 --> 00:02:38,430 una spaziatura tra quegli elementi e ovviamente anche su iOS se lo facciamo lì. 27 00:02:38,550 --> 00:02:46,440 Quindi questo ora aggiunge i nostri articoli e anche se probabilmente non vinceremo ancora un premio di bellezza, è almeno un buon inizio e ci immergeremo 28 00:02:46,440 --> 00:02:51,050 più a fondo nello styling e tutto ciò che puoi fare lì più avanti in questo 29 00:02:51,060 --> 00:02:54,090 corso, dobbiamo solo ottenere lì passo dopo passo ovviamente. 30 00:02:54,090 --> 00:03:00,750 Ora una cosa che dobbiamo regolare ora a proposito, la chiave qui deve sempre essere sull'elemento radice nella tua lista, quindi l'elemento 31 00:03:00,750 --> 00:03:01,460 che stai 32 00:03:01,500 --> 00:03:05,730 ripetendo e non stiamo più solo ripetendo il testo, invece siamo ora ripetendo l'intera 33 00:03:05,730 --> 00:03:07,020 vista, quindi la chiave 34 00:03:07,320 --> 00:03:14,430 dovrebbe essere aggiunta alla vista qui, non al testo nella vista. Ecco perché ho ricevuto questo avviso, di nuovo questo errore, 35 00:03:14,430 --> 00:03:15,520 ora con la 36 00:03:15,600 --> 00:03:19,230 chiave spostata nella vista anziché nel testo, questo dovrebbe essere sparito.