Export (0) Print
Expand All

ContextMenu Overview

The ContextMenu class represents the element that exposes functionality by using a context-specific Menu. Typically, a user exposes the ContextMenu in the user interface (UI) by right-clicking the mouse button. This topic introduces the ContextMenu element and provides examples of how to use it in Extensible Application Markup Language (XAML) and code.

This topic contains the following sections.

ContextMenu Control

A ContextMenu is attached to a specific control. The ContextMenu element enables you to present users with a list of items that specify commands or options that are associated with a particular control, for example, a Button. Users right-click the control to make the menu appear. Typically, clicking a MenuItem opens a submenu or causes an application to carry out a command.

The following figure illustrates a ContextMenu in two different states: the default state and the pressed state. In the default state the control is collapsed, when the right mouse button is pressed over the parent of the menu the control expands and displays the menu items.

ContextMenu in different states
Context menu states

Creating ContextMenus

The following examples show how to create a ContextMenu with submenus. The ContextMenu controls are attached to button controls.

<Button Name="cmButton" Height="30">Button with Context Menu
<Button.ContextMenu>
<ContextMenu Name="cm" Opened="OnOpened" Closed="OnClosed" StaysOpen="true">
   <MenuItem Header="File"/>
   <MenuItem Header="Save"/>
   <MenuItem Header="SaveAs"/>
   <MenuItem Header="Recent Files">
        <MenuItem Header="ReadMe.txt"/>
        <MenuItem Header="Schedule.xls"/>          
   </MenuItem>
</ContextMenu>
</Button.ContextMenu>
</Button>

btn = new Button();
btn.Content = "Created with C#";
contextmenu = new ContextMenu();
btn.ContextMenu = contextmenu;
mi = new MenuItem();
mi.Header = "File";
mia = new MenuItem();
mia.Header = "New";
mi.Items.Add(mia);
mib = new MenuItem();
mib.Header = "Open";
mi.Items.Add(mib);
mib1 = new MenuItem();
mib1.Header = "Recently Opened";
mib.Items.Add(mib1);
mib1a = new MenuItem();
mib1a.Header = "Text.xaml";
mib1.Items.Add(mib1a);
contextmenu.Items.Add(mi);
cv2.Children.Add(btn);

For the complete sample, see ContextMenu Sample.

Applying Styles to a ContextMenu

By using control Styles, you can dramatically change the appearance and behavior of a ContextMenu without writing a custom control. In addition to setting visual properties, you can also apply styles to parts of a control. For example, you can change the behavior of parts of the control through properties; or add parts to, or change the layout of, a ContextMenu. The following examples show several ways to add styles to ContextMenu controls.

The first example defines a style called SimpleSysResources, which shows how to use the current system settings in your style. The example assigns MenuHighlightBrushKey as the Background color and MenuTextBrushKey as the Foreground color of the ContextMenu.

<Style x:Key="SimpleSysResources" TargetType="{x:Type MenuItem}">
    <Setter Property = "Background" Value= 
       "{DynamicResource {x:Static SystemColors.MenuHighlightBrushKey}}"/>
    <Setter Property = "Foreground" Value= 
       "{DynamicResource {x:Static SystemColors.MenuTextBrushKey}}"/>
</Style>

The following example uses the Trigger element to change the appearance of a Menu in response to events that are raised on the ContextMenu. When a user moves the mouse over the menu, the appearance of the ContextMenu items changes.

<Style x:Key="Triggers" TargetType="{x:Type MenuItem}">
    <Style.Triggers>
    <Trigger Property="MenuItem.IsMouseOver" Value="true">
        <Setter Property = "FontSize" Value="16"/>
        <Setter Property = "FontStyle" Value="Italic"/>
	<Setter Property = "Foreground" Value="Red"/>
    </Trigger>
    </Style.Triggers>
</Style>

For the complete sample, see ContextMenu Styles Sample.

See Also

Community Additions

ADD
Show:
© 2014 Microsoft