Associazione dati di Windows e MVVM

Model-View-ViewModel (MVVM) è un modello di progettazione architetturale dell'interfaccia utente che separa l'interfaccia utente e il codice non dell'interfaccia utente. Informazioni su come MVVM consente l'accoppiamento libero usando il data binding in XAML per sincronizzare l'interfaccia utente e i dati, migliorando la gestibilità e riducendo le dipendenze.

Poiché offre un accoppiamento libero, l'uso del data binding riduce le dipendenze difficili tra diversi tipi di codice. Questo approccio semplifica la modifica di singole unità di codice (metodi, classi, controlli e così via) senza causare effetti collaterali imprevisti in altre unità. Questo disaccoppiamento è un esempio della separazione delle preoccupazioni, che è un concetto importante in molti modelli di progettazione.

Vantaggi di MVVM

Il disaccoppiamento del codice offre molti vantaggi, tra cui:

• Abilitazione di uno stile di codifica iterativo esplorativo. Il cambiamento isolato è meno rischioso e più facile da sperimentare.
• Semplificazione degli unit test. È possibile testare unità di codice isolate l'una dall'altra singolarmente e all'esterno degli ambienti di produzione.
• Supporto della collaborazione tra team. Singoli utenti o team possono sviluppare codice disaccoppiato conforme alle interfacce ben progettate e integrarlo in un secondo momento.
• Miglioramento della manutenibilità. La correzione di bug nel codice disaccoppiato è meno probabile che causi regressioni in altro codice.

A differenza di MVVM, un'app con una struttura "code-behind" più convenzionale usa in genere il data binding per i dati di sola visualizzazione. Risponde all'input dell'utente gestendo direttamente gli eventi esposti dai controlli. I gestori eventi vengono implementati nei file code-behind (ad esempio MainWindow.xaml.cs) e spesso sono strettamente associati ai controlli. In genere contengono codice che modifica direttamente l'interfaccia utente. Questa struttura rende difficile o impossibile sostituire un controllo senza dover aggiornare il codice di gestione degli eventi. Con questa architettura, i file code-behind spesso accumulano codice non direttamente correlato all'interfaccia utente, ad esempio il codice di accesso al database, che finisce per essere duplicato e modificato per l'uso con altre finestre.

Livelli dell'app

Quando si usa il modello MVVM, dividere l'app nei livelli seguenti:

• Il livello del modello definisce i tipi che rappresentano i dati aziendali. Questo livello include tutti gli elementi necessari per modellare il dominio principale dell'app e spesso include la logica principale dell'app. Questo livello è completamente indipendente dai livelli di visualizzazione e modello di visualizzazione e spesso risiede parzialmente nel cloud. Dato un livello modello completamente implementato, è possibile creare più app client diverse se si sceglie, ad esempio Windows App SDK e app Web che funzionano con gli stessi dati sottostanti.
• Il livello di visualizzazione definisce l'interfaccia utente usando il markup XAML. Il markup include espressioni di data binding (ad esempio x:Bind) che definiscono la connessione tra componenti dell'interfaccia utente specifici e vari membri del modello e del modello di visualizzazione. A volte è possibile usare file code-behind come parte del livello di visualizzazione per contenere codice aggiuntivo necessario per personalizzare o modificare l'interfaccia utente o per estrarre dati dagli argomenti del gestore eventi prima di chiamare un metodo view-model che esegue il lavoro.
• Il livello del modello di visualizzazione fornisce le destinazioni di data binding per la visualizzazione. In molti casi, il modello di visualizzazione espone direttamente il modello o fornisce membri che incapsulano membri specifici del modello. Il modello di visualizzazione può anche definire membri per tenere traccia dei dati rilevanti per l'interfaccia utente, ma non per il modello, ad esempio l'ordine di visualizzazione di un elenco di elementi. Il modello di visualizzazione funge anche da punto di integrazione con altri servizi, ad esempio il codice di accesso ai dati. Per i progetti semplici, potrebbe non essere necessario un livello modello separato, ma solo un modello di visualizzazione che incapsula tutti i dati necessari.

MVVM di base e avanzato

Come per qualsiasi modello di progettazione, esiste più di un modo per implementare MVVM e molte tecniche diverse sono considerate parte di MVVM. Per questo motivo, esistono diversi framework MVVM di terze parti che supportano le varie piattaforme basate su XAML, tra cui Windows App SDK. Tuttavia, questi framework includono in genere più servizi per l'implementazione di un'architettura disaccoppiata, rendendo in qualche modo ambigua la definizione esatta di MVVM.

Anche se i framework MVVM sofisticati possono essere molto utili, soprattutto per i progetti su scala aziendale, in genere esiste un costo associato all'adozione di qualsiasi modello o tecnica particolare e i vantaggi non sono sempre chiari, a seconda della scala e delle dimensioni del progetto. Fortunatamente, è possibile adottare solo quelle tecniche che forniscono un vantaggio chiaro e tangibile e ignorare gli altri finché non sono necessari.

In particolare, è possibile ottenere molti vantaggi semplicemente comprendendo e applicando la massima potenza del data binding e separando la logica dell'app nei livelli descritti in precedenza. A tale scopo, è possibile usare solo le funzionalità fornite da Windows App SDK e senza usare framework esterni. In particolare, l'estensione di markup {x:Bind} semplifica e aumenta le prestazioni del data binding rispetto alle piattaforme XAML precedenti, eliminando la necessità di un sacco di codice boilerplate richiesto in precedenza.

Per indicazioni aggiuntive sull'uso di MVVM di base e predefinita, vedere l'esempio UWP database ordini clienti su GitHub. Molti degli altri esempi di app UWP usano anche di base un'architettura MVVM e l'esempio di app Traffico UWP include sia le versioni code-behind che MVVM, con note che descrivono la conversione MVVM.

Vedere anche

Argomenti

Approfondimento su Data Binding
Estensione di markup {x:Bind}

Esempi di MVVM UWP

Esempio di database degli ordini clienti
Esempio di inventario VanArsdel
Esempio di app per il traffico