Introduzione
Il data binding consente di dichiarare le relazioni tra i dati e i controlli dell'interfaccia utente. In caso di modifiche, questi elementi rimangono automaticamente sincronizzati. I data binding possono rendere il codice più veloce da leggere, più semplice da gestire e più facile da testare.
Il data binding offre un modo per accoppiare l'interfaccia utente direttamente ai dati anziché associare l'interfaccia utente al codice nel code-behind dell'interfaccia utente. Quando l'interfaccia utente è associata ai dati, l'interfaccia utente viene aggiornata automaticamente quando i dati vengono modificati, mantenendo la sincronizzazione con i dati. In caso contrario, se l'utente interagisce con l'interfaccia utente, i dati vengono mantenuti sincronizzati con l'interfaccia utente.
Scenario di esempio
Si supponga di lavorare su un'app che presenta agli utenti informazioni meteo per un'area o un indirizzo selezionato. Quando l'utente immette una posizione, l'app carica i dati delle previsioni meteo da un servizio meteo esterno e aggiorna l'interfaccia utente. L'interfaccia utente e i dati del servizio meteo sono strettamente associati tramite l'interfaccia utente XAML e il file code-behind XAML. Il servizio meteo è già astratto alla propria classe, ma l'interfaccia utente si basa principalmente sul code-behind per presentare tali dati all'interfaccia utente.
Un po' di tempo dopo il rilascio dell'app, il servizio meteo usato annuncia che sta per essere chiuso. Per anticipare questa situazione, si inizia a cercare un servizio sostitutivo. Si nota che tutti i servizi valutati eseguono l'input e l'output dei dati in modi diversi. Poiché l'interfaccia utente usa eventi code-behind per l'interazione con il servizio, l'esperienza dell'interfaccia utente potrebbe essere interessata da questa modifica.
Sarebbe utile modificare il modo in cui l'interfaccia utente sincronizza gli aggiornamenti meteo, passando dagli eventi code-behind al data binding. In questo modo, se si verifica di nuovo una modifica del servizio, l'impatto sul codice sarà minimo.
Contenuto dell'esercitazione
Questo modulo illustra le differenze tra un'interfaccia utente basata su codice e un'interfaccia utente associata a dati e illustra come usare il data binding per aggiornare l'interfaccia utente anziché il code-behind. Usando un'app meteo di esempio, si convertiranno gli aggiornamenti dell'interfaccia utente dal code-behind al data binding.
Che cosa si impara
Al termine di questo modulo si sarà in grado di usare il data binding per presentare i dati nell'interfaccia utente e trasformare i dati quando i tipi di interfaccia utente e i tipi di dati non corrispondono.
Prerequisiti
- Visual Studio 2022 con il carico di lavoro .NET MAUI installato
- Facoltativo: Visual Studio Code con l'estensione .NET MAUI e .NET SDK con il carico di lavoro .NET MAUI installato
Requisiti per lo sviluppo con .NET MAUI
Per creare app .NET MAUI con .NET 9, è necessario installare Visual Studio versione 17.12 o successiva con il carico di lavoro seguente installato:
- Sviluppo .NET Multi-Platform App UI
Inoltre, se si vogliono creare app .NET MAUI Blazor, è necessario installare il carico di lavoro ASP.NET e sviluppo Web.
Per una procedura dettagliata della configurazione, vedere la documentazione.
Sviluppo con Visual Studio Code
Se si sviluppa in macOS o Linux, è necessario installare Visual Studio Code e l'estensione .NET MAUI insieme a .NET SDK e al carico di lavoro .NET MAUI. Per una procedura dettagliata della configurazione, vedere la documentazione.