As part of my WPF experiments, in the last one I posted how to Add shortcuts in WPF menus. I this post I am adding Icons to WPF menu.

Upto .Net 2.0, to display icons in menus, we need add a menu strip to the form, right click on the menuitem and select “Set Image”, it will popup a window, where we can select the Image and it will automatically updated in menu.
But in WPF there is not “Set Image” menu item in the right click and the properties window, it is a Textbox. After few googling I found a solution.

<Grid>
<Grid.Resources>
<!-- Here I am loading all the Images -->
<Image x:Key="folder" Source="Icons/folder.ico" Height="16" Width="16" />
<Image x:Key="Open" Source="Icons/Open16x16.ico" Height="16" Width="16" />
<Image x:Key="Save" Source="Icons/Save16x16.ico" Height="16" Width="16" />
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>       
<Menu Grid.Row="0" >
<MenuItem Header="_File">
<MenuItem Header="_Open" Icon="{StaticResource Open}" />
<MenuItem Header="Open _Folder" Icon="{StaticResource folder}" />
<Separator />
<MenuItem Header="_Save" Icon="{StaticResource Save}" />
</MenuItem>
</Menu>
<Image Grid.Row="1" />
</Grid>

Screenshot, which displaying Icons on menu items

Please not if you not set the Height and Width properties, in Resources, the Icons will grow automatically, to the full window

Update : You can set the application Icon or the Window Icon by simple markup like this

<window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:winfx="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Icons in Menu" Height="300" Width="300" Icon="Icons/folder.ico">

From the last few days I was searching for adding shortcut keys to WPF menu items. I didn’t see any direct method over there in Visual Studio. But after some googling I found some ways.

1. Using access keys, like ALT+key – This is like the old Hot key implementation, using &, but & will not work in WPF instead of this we need to use “_”
   <MenuItem Header="_Open" />
   But these way you can use ALT+ key as the shortcut key
2. Using code, like for displaying the shortcut key in the Menu item you can use “InputGestureText”e; property of menu item and using the code, need to capture the key press. I don’t know is it possible or not, I wasn’t checked this method, but the shortcut will appear on the menu
   <MenuItem Header="_Open" InputGestureText="Ctrl+O" />
3. The final way is using CommandBindings. I found this way is better compare to the previous methods, and it is an easy way.
   1. In the markup create the command Bindings using Command Collections.
      <CommandBinding Command="ApplicationCommands.Open" CanExecute="CommandCanExecute" Executed="CommandExecuted" />
<CommandBinding Command="ApplicationCommands.Close" CanExecute="CommandCanExecute" Executed="CommandExecuted" />
   2. In the code implement the event Handlers.
      Sub CommandExecuted(ByVal sender As Object, ByVal e As ExecutedRoutedEventArgs)
'Add the commands to be executed.
If e.Command.Equals(ApplicationCommands.Open) Then
MessageBox.Show("Open Menu item clicked")
ElseIf e.Command.Equals(ApplicationCommands.Close) Then
MessageBox.Show("Close menu item clicked")
End If
End Sub
Sub CommandCanExecute(ByVal sender As Object, ByVal e As CanExecuteRoutedEventArgs)
e.CanExecute = True 'I am always returning true, based on this the menu item will enabled / disabled
End Sub

   3. Assign the Commands to the Command property of our menu items. <MenuItem Command="ApplicationCommands.Open" >
<Separator />
<MenuItem Command="ApplicationCommands.Close" />

Compile it run it. You will see “Ctrl + O” added to the right side Open menu item.

You can see Ctrl + O added into the Open Menu item(Screenshot)