WPF Web Based

A Menu is a collection of menu items with a command associated with each menu items. A menu item may have children menu items called submenus. This article discusses how to work with menus in XAML and WPF applications.

The Menu tag in XAML creates a menu control.

The Name property defines the name of the menu and Height and Width represents the height and width of a menu control.

Syntax Of Menu Control:

<Menu Margin="37,15,63,0" Name="menu1" Height="22" VerticalAlignment="Top" />

This Tag Creates a Menu Control.

Important Properties:

• Name: Defines the name of the menu.
• Height: Defines the Height of the menu
• Width: Defines the width of the menu
• Margin: Defines the position of the menu
• Background: Defines backcolor of the menu
• HorizontalAlignment: Defines the horizontal alignment of the menu inside the parent control.
• HorizontalContentAlignment: Defines the horizontal alignment for the menu content.
• VerticalAlignment: Defines the vertical alignment of the menu inside the parent control.
• VerticalContentAlignment: Defines the content alignment for the menu content.
• ToolTip: defines the tooltip for the menu.

A MenuItem can have other MenuItem tags within it as child/sub menus and can go up to several levels. The following code adds three children menu items to first menu item.

<MenuItem Header="_File">          
<MenuItem Header="_Open" IsCheckable="true"/>
<MenuItem Header="_Close" IsCheckable="true"/>
<MenuItem Header="_Save" IsCheckable="true"/>
</MenuItem>  

Adding Tooltips to Menus:

The MenuItem.ToolTip tag adds a tooltip to a menu item. The following code adds a tooltip to the Open menu item.

<MenuItem Header="_Open" IsCheckable="true">
<MenuItem.ToolTip>
<ToolTip>
 Open a file.
</ToolTip>
</MenuItem.ToolTip>
</MenuItem>

The Click event is used to add the menu item click event handler. The following code adds a click event handler for a menu item.

<MenuItem IsCheckable="true" Header="_Open" Click="MenuItem_Click">

The event handler is defined like following in the code behind. I added a message box when the menu item is clicked.

private void MenuItem_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Menu item clicked");
} 

.XAML Code Of Menu Control:

<Page x:Class="WpfBrowserApplication5.Page2"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page2">
<Grid>
<Menu IsMainMenu="True" Background="LightCyan">
<MenuItem Header="_File" Click="MenuItem_Click" FontSize="15" Foreground="Blue">
<MenuItem Header="_Open" IsCheckable="true" Click="MenuItem_Click">
<MenuItem.ToolTip>
<ToolTip>
Open a file.
</ToolTip>
</MenuItem.ToolTip>
</MenuItem>
<MenuItem Header="_Close" IsCheckable="true"/>
<MenuItem Header="_Save" IsCheckable="true"/>
</MenuItem>
<MenuItem Header="_Edit" Click="MenuItem_Click_1" Foreground="Blue" FontSize="15" />
<MenuItem Header="_View" Click="MenuItem_Click_2" Foreground="Blue" FontSize="15" />
<MenuItem Header="_Window" FontSize="15" Foreground="Blue" />
<MenuItem Header="_Help" Click="MenuItem_Click_3" Foreground="Blue" FontSize="15" />
</Menu>
</Grid>
</Page>

Output: