How to use xaml vector images as image source in Windows 8 app

Question

I created some assets in inkscape and would like to use them as icons in a windows 8 application. I have done some reading and it seams that while .Net 4.5 supports SVG, the mod

Answer 1

Most AppBar buttons are based on a style included in StandardStyles called AppBarButtonStyle.

To customize the text of the button you set the AutomationProperties.Name attached property, to customize the icon in the button you set the Content property, and it's also a good idea to set the AutomationProperties.AutomationId attached property for accessibility reasons.

Here's an example of a button customized using this approach:

As mentioned above, to customize the icon you set the Content property. The challenge is how you set the content so it displays your custom vector art.

It turns out you can place any path Xaml, even yours, into a Viewbox to change its scale. That was my first approach, but it doesn't work. In fact, it seems any time you use Xaml expanded notation to set the Content property for a button it doesn't work.

And finally, you use it in your AppBar like this:

Dev support, design support and more awesome goodness on the way: http://bit.ly/winappsupport