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“, „XAML: Inline Color Picker für den XAML-Editor“ und „WPF: Bilder rund anzeigen“.

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 View­Model abgelegt.

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 ViewModels 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 [1] oder 2015 [2] aus der Vi­sual 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 View­Model 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. 2: Im Menü unter „Tools“ befindet sich die ViewModel-Tuck-Away-Erweiterung

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

XAML: Inline Color Picker für den XAML-Editor

Das Expression-Blend-Produktteam von Microsoft ist das gleiche Team, das für den XAML-Editor in Visual Studio verantwortlich ist. Bei den ersten Visual-Studio-Versionen mit WPF-Support hätte das kaum noch jemand geglaubt; die Unterschiede zwischen Blend und Visual Studio waren wie Tag und Nacht. Die Zeit hat allerdings einiges geändert...