XAML-Tipp: Produktiver entwickeln mit vsXEN

XAML-Kolumne: WPF und Windows-Apps

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: Produktiver entwickeln mit vsXEN.

Emmet ist eine Erweiterung für verschiedene Texteditoren zur schnellen Erstellung von XML-, HTML- und CSS-Code. Befehle für Emmet werden in einer eigenen Kurzschreibweise verfasst und direkt im Editor ausgeführt, zum Beispiel durch das Betätigen der Tabulatortaste. Die Erweiterung wandelt die Kürzel im Texteditor sofort in normalen Code um, der wie gewohnt verwendet werden kann. Bisher war Emmet nur für klassische Webentwickler vorenthalten. Das ändert die kostenlose Visual-Studio-Erweiterung vsXEN. Nach der Installation der Erweiterung, die im Visual Studio Marketplace bereitsteht, kann diese direkt im XAML-Editor zum Einsatz kommen.

Visual Studio: Mehr Produktivität mit der vsXEN-Extension

So wird der Code btn nach Betätigen der Tabulatortaste zu <button></button>. Das spart erheblichen Entwicklungsaufwand. Noch mehr Produktivität gewinnt man durch weitere Codekombinationen. Hier einige Beispiele: Aus btn#myButton wird <button name="myButton"></button>. Oder aus grid>stack#myStack>btn.BlueButton*5 wird das Ergebnis in Listing 1 generiert. Eine ausführliche Beschreibung des Codes von vsXEN gibt es auf der Produktwebseite.

<Grid>
  <StackPanel x:Name="myStack">
    <Button Style="{DynamicResource BlueButton}"></Button>
    <Button Style="{DynamicResource BlueButton}"></Button>
    <Button Style="{DynamicResource BlueButton}"></Button>
    <Button Style="{DynamicResource BlueButton}"></Button>
    <Button Style="{DynamicResource BlueButton}"></Button>
  </StackPanel>
</Grid>