Kolumne XAML Expertise: WPF und Windows-Apps

XAML-Tipp: Bessere MVVM-Struktur mit ViewModel Tuck Away
Kommentare

In der Kolumne „XAML Expertise“ präsentiert Gregor Biswanger Top-How-tos zum Thema XAML. Einsteiger und fortgeschrittene XAML-Experten sollen hier durch geballtes Wissen gesättigt werden. Heute gibt es folgende Expertise: „XAML: Bessere MVVM-Struktur mit ViewModel Tuck Away“.

Eine saubere Projektstruktur ist essenziell, wenn bei der Entwicklung eine hohe Produktivität erzielt werden soll. Die klassische MVVM-Struktur wurde hierbei schon lange in Frage gestellt. Die XAML-Dateien werden in das Views-Verzeichnis abgelegt und die ViewModel-Klassen im Verzeichnis ViewModels. In den meisten Fällen braucht man beide Gegenstücke im Editor. Das Aufklappen und Auffinden beansprucht immer wieder seine Orientierungszeit. Ein neues und vielversprechendes Konzept wäre die featurebasierte Struktur. So wird ein Verzeichnis pro Feature angelegt, wie zum Beispiel Dashboard. Darin werden dann die View und das ViewModel abgelegt.

XAML: Bessere MVVM-Struktur mit ViewModel Tuck Away

Für eine noch bessere Verknüpfung beider Welten hat Karl Shifflett eine Erweiterung für Visual Studio geschrieben: das ViewModel „Tuck Away“. Es ermöglicht das Anbinden des ViewModel direkt an die View, so wie wir es mit der Code-Behind-Datei bereits gewohnt sind. Das beschleunigt den Zugriff und sorgt automatisch für eine effektivere Struktur.

Nach der Installation von ViewModel Tuck Away for Visual Studio 2013 oder 2015 aus der Visual Studio Gallery müssen beide dazugehörigen Dateien im Solution Explorer markiert werden (Abb. 1). Wichtig ist hierbei der Namensaufbau beider Dateien. Der Name der XAML-Datei muss mit „View“ enden und das ViewModel mit der Endung „ViewModel“. Anschließend wird im Menü unter TOOLS > VIEWMODEL TUCK AWAY geklickt. Die Dateien sind nun miteinander im Solution Explorer verknüpft (Abb. 2 und Abb. 3).

Abb. 1: Die XAML- und ViewModel-Datei müssen selektiert werden

Abb. 1: Die XAML- und ViewModel-Datei müssen selektiert werden

Abb. 2: Im Menü unter „Tools“ befindet sich die ViewModel-Tuck-Away-Erweiterung

Abb. 2: Im Menü unter „Tools“ befindet sich die ViewModel-Tuck-Away-Erweiterung

Abb. 3: Die View und das ViewModel sind nun miteinander verknüpft

Abb. 3: Die View und das ViewModel sind nun miteinander verknüpft

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -