Präsentation MVVM Model-View-ViewModel

Martin Reber Res Rentsch 02.09.2014 / BFH-TI / Kurs Analyse und Design Pattern

Inhalt

1. Teil • Einführung / Zweck

• Eigenschaften

• Übersicht

• Vor- und Nachteile

2. Teil • Szenario

• Lösung

• Verweis auf andere Pattern

• Fragen

Einführung / Zweck

• Model-View-ViewModel

• MVVM ist ein Architektur Pattern und wurde von John Gossmann (Microsoft MVP) 2005 veröffentlicht.

• Variante des MVC (Model View Controller) Patterns und hat Ähnlichkeiten mit dem MVP (Model View Presenter) Pattern.

• Es dient zur Trennung von Darstellung und Logik der Benutzerschnittstelle (UI).

Eigenschaften

• Auftrennung in separate Teile

• Die View kapselt den UI Aufbau (XAML).

• Das ViewModel kapselt die Präsentationslogik und den Status der Anwendung.

• Das Model kapselt die Businesslogik und deren Daten.

• CodeBehind UI bleibt möglichst leer (ausser Konstruktor).

• View interagiert mittels Bindings, Commands und Change-Notification-Events mit dem ViewModel.

• Dank XAML-Binding existiert zwischen der View und dem ViewModel eine lose Koppelung.

• MVVM definiert keine Vorgaben für die Kommunikation zwischen ViewModel und Model. Es macht aber Sinn, auch dafür Patterns zu verwenden.

Übersicht

Vor- und Nachteile

Vorteile • Möglichst einfache View

• Strikte Trennung von Design und Logik

• Testbarkeit

• Datengebunden Controls updaten sich automatisch

Nachteile • Einarbeitungszeit

• MVVM ist nicht standardisiert

• Zu umfangreich für kleinere Projekte

Lösung mit Visual Studio

Herkömmliche Umsetzung: Ohne MVVM, mit Code behind

XAML: Definition GUI Steuerelemente

Code behind: Abarbeiten GUI-Logik

Abarbeiten Methode mit Eventhandler

Eigenschaft Button verändern

Lösung mit Visual Studio

Umsetzung mit MVVM: Bindung an Variable

XAML: Definition GUI Steuerelemente

ViewModel: Update Variable und

Eigenschaft Steuerelement (get und set)

Eigenschaft ist an Variable gebunden

Lösung mit Visual Studio

Umsetzung mit MVVM: Command Bindung

XAML: Definition GUI Steuerelemente

ViewModel: Eventlogik

Abarbeiten ausgelagerte Eventhandler-Klasse

Gesamtarchitektur Anwendungsbeispiel

App View

ViewModel

Model View

ViewModel

Implemen-tation Server

Host

Server

Model.Test

Testmethoden

Implemen-tation.Test Testmethoden

Contract

Datentypen

View-Model.Test Testmethoden

Client Server

WCF

Verweis auf andere Pattern

Observable Pattern: Update List Collection

Proxy Pattern: Client holt Daten beim Server

Factory Pattern: WCF-Kommunikation (Server-Client)

Präsentation MVVM Model-View-ViewModel

Martin Reber Res Rentsch 02.09.2014 / BFH-TI / Kurs Analyse und Design Pattern

Fragen / Diskussion