WPF menu item with image

Question

How to define MenuItem.Icon so that the text of MenuItemHeader is placed below the image of the menu item? Thanks for the help!

Answer 1

The easiest way is not to use the Icon property, but instead put the icon in the header:

<Menu> <MenuItem> <MenuItem.Header> <StackPanel> <Image Width="20" Height="20" Source="/XSoftArt.WPFengine;component/Images/export32x32xp.png" /> <ContentPresenter Content="Reports" /> </StackPanel> </MenuItem.Header> </MenuItem> <MenuItem Header="Export" /> <MenuItem Header="New record" /> </Menu> 

In this simple case, <ContentPresenter Content="Reports" /> can be replaced with <TextBlock Text="Reports" /> , because what ContentPresenter will use to represent the string anyway. For more complex Header= you can use ContentPresenter as shown.

Answer 2

Like something like:

 <ContextMenu> <MenuItem Header="Reports"> <MenuItem.Icon> <Image Source="/XSoftArt.WPFengine;component/Images/export32x32xp.png"/> </MenuItem.Icon> </MenuItem> </ContextMenu> 

Answer 3

In the case of the StackPanel, use a Label, not a TextBlock, since only a Label will allow you to have mnemonics in the menu, for example _Reports.