Menu Control Using WPF Window Based

Menu Control Using WPF Window 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> 
 

Adding an Event Trigger to a 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:

<Window x:Class="WpfApplication7.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="370" Width="417">
    <Grid>
        <Menu IsMainMenu="True" Background="WhiteSmoke">
            <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>
</Window>