WEBVTT 00:00.110 --> 00:00.950 Bentornati. 00:00.950 --> 00:04.070 In questo video impareremo a conoscere il Constraintlayout. 00:04.070 --> 00:05.360 In Android Studio. 00:05.390 --> 00:09.620 Abbiamo tre viste di testo all'interno di questo layout relativo. 00:09.620 --> 00:15.680 Cambierò questo Relativelayout in un Constraintlayout di tipo Constraintlayout. 00:15.680 --> 00:23.060 Questo è il tag del Constraintlayout android x dot Constraintlayout dot widget dot Constraintlayout. 00:23.060 --> 00:28.670 Questo è per gli attributi di questo Constraintlayout e per il tag finale. 00:28.670 --> 00:32.120 E il tag di chiusura per il Constraintlayout è qui! 00:32.120 --> 00:39.110 Constraintlayout è un gestore di layout versatile e potente, introdotto in Android, che consente di creare con facilità 00:39.110 --> 00:43.160 progetti di interfaccia utente complessi e flessibili. 00:43.160 --> 00:50.390 È stato progettato per facilitare la creazione di layout reattivi e dinamici, per adattarsi a varie dimensioni e orientamenti 00:50.390 --> 00:54.470 dello schermo e per ridurre la necessità di layout annidati. 00:54.470 --> 01:02.870 Il concetto centrale di Constraintlayout è quello dei vincoli, che definiscono il posizionamento e il dimensionamento 01:02.870 --> 01:07.340 delle viste figlio rispetto alle altre e al layout padre. 01:07.340 --> 01:15.620 I vincoli vengono impostati specificando le connessioni tra i bordi di una vista e le altre viste o il 01:15.620 --> 01:16.850 layout padre. 01:16.850 --> 01:24.080 Per rimuovere i vincoli, si può fare clic su questo pulsante Cancella tutti i vincoli; rimuoverò tutti 01:24.080 --> 01:28.220 i vincoli da questo layout e avremo tre viste di testo. 01:30.890 --> 01:32.960 Posso trascinarli e rilasciarli. 01:32.960 --> 01:39.140 Ogni widget e ogni visualizzazione in Android ha quattro cerchi. 01:39.140 --> 01:46.430 Per i punti di ancoraggio è necessario ancorarne almeno uno orizzontale e uno verticale. 01:46.430 --> 01:51.050 Sto ancorando questa vista di testo con il bordo genitore. 01:51.050 --> 01:52.070 Lo si può vedere. 01:52.070 --> 01:59.030 Questo è il layout di vincolo del genitore, al quale abbiamo specificato un margine di 20 dpi. 01:59.060 --> 02:07.640 Qui sto vincolando questa vista di testo come 48 dal genitore dall'alto e 44 da sinistra. 02:07.640 --> 02:14.450 Se faccio clic su questa vista di testo, possiamo vedere il testo e abbiamo questi attributi. 02:14.450 --> 02:20.510 Inizio del vincolo di layout all'inizio del genitore. 02:21.650 --> 02:29.990 Seguendo la formula generale degli attributi dei vincoli, specifichiamo l'ancoraggio di origine come 02:29.990 --> 02:40.670 da inizio a inizio e l'id di destinazione, che io indico come inizio genitore, che è l'inizio dell'ancoraggio di origine, che è l'ancoraggio 02:40.670 --> 02:46.130 di destinazione e l'ID di destinazione che è genitore. 02:46.130 --> 02:53.210 È possibile specificare un altro ID, un altro ID di vista come la prima vista di testo. 02:53.210 --> 03:01.220 E si può vedere che è vincolata all'inizio di questa prima vista di testo e poi a un'altra vista di testo 03:01.220 --> 03:06.980 che è la seconda vista di testo di cui devo specificare il genitore. 03:06.980 --> 03:09.440 E abbiamo anche un altro vincolo. 03:09.440 --> 03:15.800 Questo è per il vincolo verticale e questo è per il vincolo orizzontale superiore. 03:15.800 --> 03:17.840 Questa è l'ancora di partenza. 03:17.870 --> 03:24.320 Questa è l'ancora di destinazione, che è la parte superiore, e questo è l'id, che è l'ID di destinazione. 03:24.320 --> 03:26.420 In questo caso sto ancorando. 03:26.420 --> 03:34.070 Sto vincolando questa vista di testo al genitore del constraintlayout genitore, che in questo caso 03:34.070 --> 03:36.170 è questo rettangolo blu. 03:36.170 --> 03:38.600 Abbiamo anche dei margini. 03:38.600 --> 03:42.200 I margini partono da 44. 03:42.200 --> 03:51.020 Qui definisco un margine di 44 da sinistra e di 48 dall'alto. 03:51.020 --> 03:55.910 È quindi possibile vedere il margine iniziale e il margine superiore. 03:55.910 --> 04:02.600 In questo caso si definiscono i vincoli per la prima vista di testo o per questa vista di testo. 04:02.600 --> 04:05.240 Passiamo ora a un'altra visualizzazione di testo. 04:05.240 --> 04:13.370 In questo caso voglio che questa vista di testo sia ancorata a questa vista di testo e non al genitore. 04:13.370 --> 04:19.460 Quindi devo specificare un vincolo orizzontale e uno verticale. 04:19.460 --> 04:22.670 Trascinerò l'ancora e la sostituirò. 04:22.670 --> 04:25.970 Qui si può vedere che la vista di testo è ancorata. 04:25.970 --> 04:28.760 Passiamo ora a un'altra visualizzazione del testo. 04:28.760 --> 04:34.040 Inoltre ho bisogno di specificare un'ancora verticale da trascinare e rilasciare. 04:34.040 --> 04:38.540 E si può vedere che questa vista di testo è ancorata a questa vista di testo. 04:38.540 --> 04:44.570 Se sposto questa vista di testo, la seconda vista di testo verrà sostituita e spostata automaticamente. 04:44.570 --> 04:50.840 Ogni volta che sposto questa vista di testo, la seconda vista di testo viene trascinata e spostata di nuovo. 04:50.840 --> 04:57.920 Se mi sposto in questa vista di testo hello world, posso centrarla in questa vista di testo. 04:57.920 --> 05:05.090 Ad esempio, se si specificano questi due vincoli orizzontali e lo si specifica in questo modo. 05:05.120 --> 05:06.770 Benvenuti al nostro corso. 05:06.770 --> 05:09.890 Sarà centrato sotto questo. 05:09.890 --> 05:11.960 Benvenuti al nostro corso TextView. 05:11.960 --> 05:15.050 Trascinare e rilasciare il terzo vincolo. 05:15.050 --> 05:16.490 Ed eccoci qui. 05:16.490 --> 05:24.770 Se sposto questo testo, si può notare che Hello World sarà di nuovo centrato perché è vincolato sia a sinistra 05:24.770 --> 05:25.910 che a destra. 05:25.910 --> 05:29.090 A questo punto, benvenuti nella nostra visualizzazione del testo del corso. 05:29.090 --> 05:37.220 Specificando i vincoli sinistro e destro, si aggiungono due vincoli orizzontali. 05:37.220 --> 05:45.770 Se si specificano i vincoli in alto e in basso o in alto e in basso, si specificano entrambi i vincoli verticali. 05:45.770 --> 05:49.910 È necessario almeno uno orizzontale e uno verticale. 05:49.910 --> 05:57.290 Se si esegue l'applicazione, si può vedere che l'applicazione reale corrisponde al nostro layout. 05:57.290 --> 06:04.880 Perché sto aggiungendo il vincolo verticale e orizzontale per ogni vista che creo. 06:04.880 --> 06:07.370 Questo è il potere del layout a vincoli. 06:07.370 --> 06:15.140 È possibile eliminare i layout annidati dal layout lineare e relativo, trascinare e rilasciare, 06:15.170 --> 06:20.540 aggiungere i vincoli orizzontali e verticali e proseguire. 06:20.540 --> 06:28.400 È possibile aggiungere molti elementi al layout dei vincoli, come le linee guida, le catene, le barriere e i rapporti 06:28.400 --> 06:29.990 di polarizzazione. 06:29.990 --> 06:34.880 Ma nei prossimi video li conosceremo in profondità. 06:34.880 --> 06:43.520 Quando si lavora con applicazioni UI complesse utilizzando il Constraint Layout, è possibile creare un'ampia gamma di 06:43.520 --> 06:48.710 progetti UI complessi e flessibili senza bisogno di layout annidati. 06:48.710 --> 06:56.870 È uno strumento potente per lo sviluppo di applicazioni Android moderne, che offre sia un editor di progettazione visiva che il supporto 06:56.870 --> 07:01.010 Xaml per adattarsi a diversi flussi di lavoro di progettazione.