WEBVTT

1
00:00.860 --> 00:04.310
Vi sto sfidando in questa sfida di
codifica.

2
00:04.310 --> 00:10.640
Dobbiamo creare un'applicazione che
contenga tre Composable, ovvero un
indicatore di avanzamento lineare.

3
00:10.640 --> 00:17.030
Il secondo, componibile, è un pulsante che
consente all'utente di aumentare
l'avanzamento quando viene cliccato.

4
00:17.030 --> 00:22.370
Il terzo componibile è il testo che
visualizza l'avanzamento.

5
00:22.370 --> 00:26.690
Tutti questi componibili dovrebbero essere
stateless.

6
00:26.690 --> 00:29.240
Mettete in pausa il video e riflettete.

7
00:29.240 --> 00:30.740
Scrivere il proprio codice.

8
00:30.740 --> 00:33.650
Spero che troviate la soluzione.

9
00:33.650 --> 00:43.640
Inizio quindi con la creazione della prima
funzione componibile, l'indicatore di
progresso lineare.

10
00:43.640 --> 00:49.430
Ha preso come parametro un progresso di
tipo float.

11
00:49.430 --> 00:56.900
E all'interno di questa funzione
componibile devo creare un indicatore di
avanzamento lineare.

12
00:56.900 --> 01:04.880
Il progresso equivale al progresso Quindi
sto creando il primo composable stateless.

13
01:04.910 --> 01:12.540
Poiché questa funzione non memorizza
alcuno stato, riceve l'avanzamento nel
parametro.

14
01:12.570 --> 01:16.230
Il secondo elemento da creare è il
pulsante.

15
01:16.260 --> 01:22.440
Quindi qui la funzione componibile aumenta
il pulsante di avanzamento.

16
01:22.440 --> 01:30.930
All'interno dei parametri dobbiamo
specificare l'onclick, che è un parametro
di

17
01:30.930 --> 01:34.500
tipo espressione lambda che non prende
parametri e non restituisce nulla.

18
01:34.530 --> 01:42.300
Ho bisogno di creare un pulsante e di
specificare il parametro onclick come
parametro onclick.

19
01:42.300 --> 01:45.510
Poi devo specificare un testo.

20
01:45.510 --> 01:48.030
Aumentare i progressi.

21
01:48.060 --> 01:53.280
Di nuovo, ragazzi, questa è un'altra
funzione compostabile senza stato.

22
01:53.310 --> 01:57.570
La terza cosa da creare è un testo che
mostri l'avanzamento.

23
01:57.570 --> 02:07.860
Quindi, allo stesso modo, creerò una nuova
funzione denominata progress text

24
02:07.860 --> 02:12.510
che riceverà un progress di tipo float e
un testo componibile.

25
02:12.540 --> 02:15.390
Il progresso è un galleggiante.

26
02:15.420 --> 02:20.910
Ok, questi sono i nostri Composables
stateless.

27
02:20.910 --> 02:24.210
Ora saliamo nel contenuto del set.

28
02:24.210 --> 02:27.090
E qui dobbiamo prestare attenzione.

29
02:27.090 --> 02:34.650
Per prima cosa è necessario creare una
variabile progress di tipo float e
utilizzare by.

30
02:34.650 --> 02:41.880
Ricordiamo lo stato mutabile di e
imposterò lo stato iniziale a 0,0 f.

31
02:41.910 --> 02:43.140
Questo è il galleggiante.

32
02:43.170 --> 02:51.690
Ok, allora devo creare una colonna per
visualizzare questi componibili in modo
verticale.

33
02:51.720 --> 02:59.130
Disposizione verticale per questa colonna
come disposizione del punto centrale.

34
02:59.340 --> 03:05.430
Nei prossimi video impareremo a conoscere
la disposizione verticale e l'allineamento
orizzontale.

35
03:05.730 --> 03:13.470
All'inizio chiameremo la funzione lineare
dell'indicatore di avanzamento che abbiamo
creato e passeremo l'avanzamento.

36
03:13.470 --> 03:20.820
La variabile di avanzamento che abbiamo
creato prima del secondo componibile è il
pulsante di avanzamento dell'aumento.

37
03:20.850 --> 03:22.800
Simulare l'aggiornamento dei progressi.

38
03:22.800 --> 03:35.020
In questo caso l'avanzamento è aumentato
di 0,1 f, pari al 10% se l'avanzamento è
superiore a 1,0 F.

39
03:35.050 --> 03:39.100
Allora cosa dobbiamo fare per ripristinare

40
03:39.100 --> 03:40.420
i progressi? È molto semplice.

41
03:40.420 --> 03:49.030
Il terzo componibile è Display progress,
che è un testo che

42
03:49.030 --> 03:49.810
abbiamo creato in precedenza e che si
chiama testo progress.

43
03:49.810 --> 03:54.340
E a questo testo di avanzamento dobbiamo
passare la variabile di avanzamento.

44
03:54.370 --> 03:54.910
Ok.

45
03:54.940 --> 03:57.430
Ora eseguiamo la nostra applicazione.

46
03:57.430 --> 03:58.270
Eccoci qua.

47
03:58.300 --> 03:59.860
Questa è la nostra applicazione.

48
03:59.860 --> 04:01.300
Abbiamo il pulsante.

49
04:01.300 --> 04:06.280
Abbiamo il testo e questo indicatore di
progresso lineare.

50
04:06.310 --> 04:08.170
Ora aumentate il progresso.

51
04:08.170 --> 04:12.910
Si può notare che l'avanzamento sta
aumentando e il testo visualizza 0,1.

52
04:12.940 --> 04:21.460
Aumentate ancora e ancora il progresso del
60%, 70%, 80%, 90% e 100.

53
04:21.460 --> 04:26.200
Quindi al 100 verrà resettato e i
progressi saranno azzerati.

54
04:26.230 --> 04:27.820
Congratulazioni ragazzi.

55
04:27.820 --> 04:31.360
Siamo riusciti a creare questa
applicazione.

56
04:31.360 --> 04:41.380
Combinando i composable, gli indicatori di
progresso, il concetto

57
04:41.380 --> 04:42.610
di stateless e la funzionalità degli
eventi click.