Edit

Share via

ContextMenu Overview

  • Article

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.

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.

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);

Dim btn As New Button()
Dim contextmenu As New ContextMenu()
Dim mi As New MenuItem()
Dim mia As New MenuItem()

btn.Background = Brushes.Red
btn.Height = 30
btn.Content = "Created with Visual Basic."

mi.Header = ("Item 1")
contextmenu.Items.Add(mi)
mia.Header = ("Item 2")
contextmenu.Items.Add(mia)

btn.ContextMenu = (contextmenu)
cv2.Children.Add(btn)

Applying Styles to a ContextMenu

By using a control Style, 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 by using properties, or you can 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>

See also