WEBVTT 00:00.110 --> 00:00.920 Bentornati. 00:00.920 --> 00:04.310 In questo video impareremo a conoscere i layout dei vincoli. 00:04.340 --> 00:12.050 Il layout a vincoli è un gestore di layout versatile e potente, introdotto in Android, che consente di creare con facilità 00:12.050 --> 00:16.550 progetti di interfaccia utente complessi e flessibili. 00:16.580 --> 00:25.370 È stato progettato per semplificare la creazione di siti reattivi e dinamici, adattarsi a varie dimensioni e orientamenti 00:25.370 --> 00:30.110 dello schermo e ridurre la necessità di layout annidati. 00:30.110 --> 00:38.360 Il concetto centrale del layout a vincoli è quello dei vincoli, che definiscono il posizionamento e il dimensionamento 00:38.360 --> 00:42.830 delle viste figlio rispetto alle altre e al layout padre. 00:42.830 --> 00:51.530 I vincoli vengono impostati specificando le connessioni tra i bordi di una vista e le altre viste o 00:51.530 --> 00:53.090 il layout padre. 00:53.090 --> 01:01.730 Viste e widget come pulsanti, testi e altri vengono aggiunti all'interno del tag layout constraint, che 01:01.730 --> 01:06.200 diventa il genitore di tutti gli elementi annidati. 01:06.200 --> 01:12.980 Nel layout a vincoli, ognuno di voi ha quattro lati, che sono chiamati punti di ancoraggio. 01:12.980 --> 01:14.450 I cerchi blu. 01:14.450 --> 01:19.580 Questi punti di ancoraggio funzionano come sorgente o come bersaglio. 01:19.580 --> 01:21.050 Per i vincoli. 01:21.050 --> 01:29.180 Per definire la posizione della vista, occorre aggiungere almeno un vincolo orizzontale e uno verticale; per 01:29.180 --> 01:37.070 impostare le posizioni orizzontali o verticali della vista, è necessario utilizzare alcuni vincoli forniti 01:37.070 --> 01:39.530 in un layout di vincoli. 01:39.530 --> 01:44.990 Questi vincoli sono scritti come mostrato in questa formula generale. 01:44.990 --> 01:50.030 Questa è la sintassi generale per definire i vincoli in Xaml. 01:50.030 --> 01:59.660 Iniziamo con il vincolo di layout dell'applicazione e dobbiamo specificare l'ancoraggio di origine, che è l'inizio e la parte superiore 01:59.660 --> 02:01.160 o inferiore. 02:01.160 --> 02:12.920 Poi abbiamo due trattini bassi e due ancore di destinazione, che in questo caso sono inizio, fine, parte superiore o inferiore, uguali all'ID di 02:12.920 --> 02:18.740 destinazione, che in questo caso può essere l'ID di qualsiasi vista. 02:18.740 --> 02:24.470 Oppure il genitore del layout principale sarà il dispositivo stesso. 02:24.470 --> 02:29.120 In questo caso si sta impostando il layout principale. 02:29.120 --> 02:37.250 Se si specifica un genitore e se si hanno layout annidati, il genitore sarà il layout che contiene quella particolare vista. 02:37.250 --> 02:41.480 Vediamo ora i diversi tipi di vincoli. 02:41.480 --> 02:44.600 La disposizione dei vincoli dall'alto verso il basso. 02:44.600 --> 02:52.790 Questo vincolo indica che la parte superiore della vista di origine deve essere uguale a quella della vista di destinazione. 02:52.790 --> 02:58.760 Lo strato superiore di entrambe le viste, verde e blu, si trova nella stessa posizione verticale. 02:58.760 --> 03:06.920 Il secondo tipo di vincolo è il vincolo di layout Pulsante al fondo, che indica che il pulsante della 03:06.920 --> 03:13.070 vista di origine deve essere uguale al fondo della vista di destinazione. 03:14.000 --> 03:21.500 Lo strato inferiore di entrambe le viste, verde e blu, si trova nella stessa posizione verticale. 03:22.770 --> 03:32.880 Un altro vincolo è top to bottom, che indica che la parte superiore della vista di origine deve essere uguale alla parte 03:32.880 --> 03:36.660 inferiore della vista di destinazione. 03:36.690 --> 03:46.740 Nell'immagine qui riportata, lo strato superiore delle viste verdi e quello inferiore delle viste blu sono in posizione verticale. 03:46.740 --> 03:57.090 Un altro vincolo di visualizzazione è il vincolo di layout bottom to top, che indica che la parte inferiore della vista di origine deve 03:57.090 --> 04:03.660 essere uguale alla parte superiore della vista di destinazione, come mostrato qui. 04:03.660 --> 04:12.120 Lo strato inferiore delle viste verdi e quello superiore delle viste blu sono nella stessa posizione verticale. 04:12.120 --> 04:14.700 Abbiamo un altro inizio di vincolo. 04:14.700 --> 04:23.220 Per cominciare, questo vincolo dice che l'inizio della vista di origine deve essere uguale all'inizio della 04:23.220 --> 04:25.170 vista di destinazione. 04:25.170 --> 04:33.660 Come si può notare, il livello iniziale della vista verde e di quella blu sono nel vincolo di layout della posizione verticale. 04:33.660 --> 04:42.060 Il vincolo End to end indica che la fine della vista di origine deve coincidere con la fine della vista 04:42.060 --> 04:43.740 di destinazione. 04:43.740 --> 04:52.980 Come si può vedere nell'immagine, lo strato finale delle viste verde e blu sono in posizione verticale. 04:52.980 --> 05:01.440 Il vincolo e to start di questo vincolo indica che la fine della vista di origine deve essere allineata all'inizio 05:01.440 --> 05:03.960 della vista di destinazione. 05:03.960 --> 05:09.750 Lo strato finale della vista verde e lo strato iniziale della vista blu sono in posizione verticale. 05:09.750 --> 05:18.480 Il vincolo Inizio-fine indica che l'inizio della vista di origine deve essere allineato alla fine della vista di 05:18.480 --> 05:19.740 destinazione. 05:19.740 --> 05:26.040 Lo strato iniziale della vista verde e quello finale della vista blu sono in posizione verticale. 05:26.040 --> 05:34.380 Con l'aiuto di questi vincoli, è possibile allineare gli elementi nel modo desiderato senza dover ricorrere a inutili 05:34.380 --> 05:36.150 layout annidati. 05:36.150 --> 05:42.930 Passiamo ad Android Studio e iniziamo a conoscere il layout dei vincoli in azione.