WEBVTT 1 00:00.890 --> 00:02.180 Bentornati. 2 00:02.180 --> 00:06.590 In questo video impareremo a conoscere i composable stateful in Jetpack Compose. 3 00:06.620 --> 00:11.180 Un composable stateful è una funzione composable che gestisce il proprio stato. 4 00:11.180 --> 00:21.470 Ciò significa che la funzione componibile conserva le informazioni che possono 5 00:21.470 --> 00:23.570 cambiare nel tempo e attiva la ricomposizione quando lo stato cambia. 6 00:23.600 --> 00:32.060 I composable stateful sono fondamentali per la costruzione di interfacce utente dinamiche, in cui 7 00:32.060 --> 00:35.600 il contenuto può essere aggiornato in risposta alle interazioni dell'utente o ad altri eventi. 8 00:35.630 --> 00:43.490 In questo esempio, impareremo a creare un compositore stateful che includa un campo di testo. 9 00:43.520 --> 00:49.220 Iniziamo creando una var text da ricordare. 10 00:49.220 --> 00:55.490 E qui imposterò lo stato mutabile di impostare la stringa vuota. 11 00:55.610 --> 01:04.090 Inoltre, importeremo i getter getvalue e set value Operator. 12 01:04.120 --> 01:04.630 Ok. 13 01:04.660 --> 01:05.560 Quindi salite. 14 01:05.560 --> 01:11.050 Si può notare che ho importato il valore get e il valore set. 15 01:11.080 --> 01:14.170 Utilizzarlo sempre quando si usa il ricordo. 16 01:14.170 --> 01:17.770 Poi creerò una nuova colonna. 17 01:17.770 --> 01:24.220 E all'interno di questa colonna dobbiamo creare il campo di 18 01:24.250 --> 01:25.810 testo che visualizza il valore corrente del campo di testo. 19 01:25.810 --> 01:31.690 E qui imposterò il valore e i parametri modificati del valore proprio. 20 01:31.690 --> 01:44.140 Qui lo imposterò su testo e il nuovo valore cambiato nuovo testo lo imposterò come lambda nuovo testo. 21 01:44.170 --> 01:46.330 Questo è il parametro. 22 01:46.330 --> 01:53.260 Ho bisogno di aggiornare la variabile testo quando il valore del campo di testo cambia. 23 01:53.260 --> 01:58.090 Inoltre, includerò un nuovo parametro chiamato label. 24 01:58.120 --> 02:06.820 Qui lo imposterò su un altro componibile, che è un testo e metterò il valore Inserisci testo. 25 02:07.120 --> 02:07.840 Eccoci qua. 26 02:07.870 --> 02:09.460 Questo è il nostro campo di testo. 27 02:09.460 --> 02:10.780 Un altro componibile. 28 02:10.780 --> 02:11.860 All'interno di questa rubrica. 29 02:11.860 --> 02:17.230 Si tratta di un testo che visualizza il valore corrente della variabile testo. 30 02:17.230 --> 02:19.240 E qui sto usando il testo. 31 02:19.270 --> 02:19.990 Ok. 32 02:19.990 --> 02:24.160 Questo è il nostro campo di testo statico componibile. 33 02:24.160 --> 02:28.870 Chiamiamolo all'interno di Setcontent ed eseguiamo l'applicazione. 34 02:28.870 --> 02:29.830 Eccoci qua. 35 02:29.860 --> 02:36.010 Questa è la nostra applicazione che aumenterò e ingrandirò per inserire il testo. 36 02:36.040 --> 02:38.650 Ciao amici. 37 02:38.650 --> 02:46.600 Si può notare che il testo viene aggiornato direttamente, automaticamente e istantaneamente. 38 02:46.600 --> 02:56.470 Questa è la potenza dell'uso degli stati mutabili e della gestione dello stato all'interno del campo di testo. 39 02:56.470 --> 02:57.340 Componibile. 40 02:57.370 --> 03:00.310 Ma voglio che vi concentriate su di me. 41 03:00.310 --> 03:08.940 Spieghiamo di nuovo cosa abbiamo fatto All'interno della funzione stateful text field, definiamo una variabile 42 03:08.940 --> 03:14.250 di stato denominata text utilizzando la funzione mutable state of fornita da Jetpack Compose. 43 03:14.250 --> 03:23.100 Questa variabile di testo contiene il valore corrente del testo inserito nel 44 03:23.100 --> 03:24.690 campo di testo e si utilizza il campo di testo componibile. 45 03:24.720 --> 03:27.720 Per creare un campo di testo. 46 03:27.720 --> 03:36.120 Il parametro value del campo di testo è legato alla variabile text, 47 03:36.120 --> 03:37.980 quindi il campo di testo visualizza il valore corrente del testo. 48 03:37.980 --> 03:45.990 Il parametro on value changed è una callback che viene invocata ogni volta 49 03:45.990 --> 03:55.710 che il valore del campo di testo cambia; all'interno di questa callback, aggiorniamo 50 03:55.710 --> 03:56.730 il valore della variabile text per riflettere il nuovo valore inserito dall'utente. 51 03:56.730 --> 04:03.750 Sotto il campo di testo, visualizziamo il valore corrente della variabile testo utilizzando il compositore di testo. 52 04:03.750 --> 04:10.050 Questo ci permette di visualizzare il testo inserito dall'utente in tempo reale. 53 04:10.050 --> 04:12.780 Ma permettetemi di farvi una domanda. 54 04:12.780 --> 04:17.910 E se volessimo usare questo testo in un'altra funzione componibile? 55 04:17.910 --> 04:25.830 Ancora, cosa succede se la nostra applicazione contiene 100 funzioni 56 04:25.830 --> 04:33.600 componibili? Dovrete gestire ogni stato di questi composable da soli 57 04:33.630 --> 04:34.860 e all'interno di ogni composable dovrete gestire lo stato. 58 04:34.860 --> 04:44.010 L'assenza di compositori stateful può introdurre complessità, soprattutto 59 04:44.010 --> 04:47.280 quando l'applicazione cresce e occorre gestire più stato. 60 04:47.280 --> 04:54.270 Quando il numero di variabili di stato aumenta, può diventare più difficile 61 04:54.270 --> 04:57.660 ragionare sul comportamento dell'interfaccia utente e mantenere la base di codice. 62 04:57.660 --> 05:07.470 I Composable Stateful gestiscono il proprio stato localmente, il che può portare a una gestione dispersiva dello stato. 63 05:07.470 --> 05:13.080 Se lo stesso stato deve essere accessibile o modificato da più compositori. 64 05:13.080 --> 05:20.370 In questi casi, spesso è meglio centralizzare la gestione dello stato 65 05:20.400 --> 05:23.190 utilizzando altre tecniche, come ViewModel o librerie di gestione dello stato. 66 05:23.220 --> 05:31.830 Inoltre, sebbene Jetpack Compose sia stato progettato per gestire in modo efficiente gli aggiornamenti e 67 05:31.830 --> 05:40.470 le ricomposizioni dello stato, un uso eccessivo dei componibili stateful può potenzialmente avere un impatto 68 05:40.470 --> 05:44.850 sulle prestazioni, soprattutto se lo stato è profondamente annidato o l'ambito della composizione è ampio. 69 05:44.880 --> 05:52.680 Inoltre, i composable stateful potrebbero richiedere un maggiore sforzo di verifica, soprattutto 70 05:52.680 --> 05:56.550 se il comportamento dell'interfaccia utente dipende fortemente dallo stato interno del composable. 71 05:56.580 --> 06:04.770 Il test dei componenti dell'interfaccia utente che si basano pesantemente sullo stato locale può 72 06:04.770 --> 06:10.020 essere più impegnativo rispetto ai componenti che sono puramente guidati da input e output.