AppBarButton mit PathIcon

Heute bestand ein Teil meiner Aufgabe darin, einen AppBarButton mit einem eigenen Icon zu versehen.

Da gibt es ja eine MSDN Seite dazu.

Kein Problem das Icon vom Grafik also PDF speichern lassen, die Dateiendung in *.ai umbenannt und in Blend Importiert.

Von den Importiertem Path die Inhalte von Data kopieren und in der App in ein PathIcon einsetzen.

<AppBarButton Label="XMyAbb" 
              x:Uid="AbbMyAbb" 
              Command="{Binding MyAbbCommand}">
    <AppBarButton.Icon>
        <PathIcon Data="M37.1446,20.828 C63.1168,19.4391                                     63.8108,1.66132 63.2553,19.3002                                     C62.6997,36.9391 59.2272,38.6053                                     59.2272,38.6053 L42.4219,35.8274                                     L36.5886,27.3555 
                        z" Foreground="White" />
    </AppBarButton.Icon>
</AppBarButton>

Alles ganz einfach - aber es funktioniert natürlich nicht wie gedacht.

Ich möchte den Post kurz halten und verrate gleich die Lösung ohne alle meine vergeblichen Versuche mit Alignment, Margin etc. zu beschreiben.

Ich müssten den Path an die 40x40 px Größe des AppBarButtons anpassen.

Das geht am besten mit dem WPF GeometryTransformer. Spielt ein wenig mit den Parametern, die euch das Tool bietet, kopiert die Ausgabe zurück in den XAML Code und schaut im Zweifel im Properties Window ob es passt.

Es gibt dazu auch Infos in einem MSDN Forums Thread und einen guten weiterführenden TechNet Artikel.