Vector-based icons in XAML menu items?
-
I'm just getting started with WPF and XAML, and I am trying to create a traditional menu bar. Everything works until I get to the menu icons. I can add a bitmap icon to a menu item using this XAML markup: <MenuItem Header="Log _In"> <MenuItem.Icon> <Image Source="MenuIcons\Add.png" /> </MenuItem.Icon> </MenuItem> However, I want to use vector graphics, rather than bitmaps, for menu icons. So, I try this markup: <MenuItem Header = "Log In"> <MenuItem.Icon> <Image Source="Resources\LogIn.xaml" /> </MenuItem.Icon> </MenuItem> I'm getting a design-time error saying that "No imaging component suitable to complete this operation was found". What's going on, and what do I need to do to be able to use a XAML vector-graphic file as a menu item icon? Thanks for your help!
David Veeneman www.veeneman.com
-
I'm just getting started with WPF and XAML, and I am trying to create a traditional menu bar. Everything works until I get to the menu icons. I can add a bitmap icon to a menu item using this XAML markup: <MenuItem Header="Log _In"> <MenuItem.Icon> <Image Source="MenuIcons\Add.png" /> </MenuItem.Icon> </MenuItem> However, I want to use vector graphics, rather than bitmaps, for menu icons. So, I try this markup: <MenuItem Header = "Log In"> <MenuItem.Icon> <Image Source="Resources\LogIn.xaml" /> </MenuItem.Icon> </MenuItem> I'm getting a design-time error saying that "No imaging component suitable to complete this operation was found". What's going on, and what do I need to do to be able to use a XAML vector-graphic file as a menu item icon? Thanks for your help!
David Veeneman www.veeneman.com
Here is the solution I finally implemented: I created a Resource Dictionary that contains the menu item icons I want to use. That gets all of the icons into one convenient container. Then I referenced the individual icon resources in my <MenuItem.Icon> markup. Here are the steps involved: I used Expression Design to create my XAML icons, one icon per layer. I gave each layer the name of the icon it held. Then I exported the Design file as XAML, setting the Document Format options to: -- Export as resource dictionary; -- Group by layers; and -- Output as drawing image. I left the effects options as they were. In VS 2008, I added the resource dictionary to my WPF project, and referenced the dictionary in App.xaml: <Application.Resources> <ResourceDictionary Source="MenuIcons.xaml" /> </Application.Resources> With that done, I simply reference the resource in the <MenuItem.Icon> markup for the window that contains the menu: <MenuItem Header="Open File"> <MenuItem.Icon> <Image Source="{StaticResource iconOpenFile}" /> </MenuItem.Icon> </MenuItem>
David Veeneman www.veeneman.com