Delen via


Overzicht van contextmenu

De ContextMenu-klasse vertegenwoordigt het element dat functionaliteit beschikbaar maakt met behulp van een contextspecifieke Menu. Normaal gesproken toont een gebruiker de ContextMenu in de gebruikersinterface (UI) door met de rechtermuisknop op de muisknop te klikken. In dit onderwerp wordt het element ContextMenu geïntroduceerd en vindt u voorbeelden van hoe u dit kunt gebruiken in Extensible Application Markup Language (XAML) en code.

Besturingselement contextmenu

Een ContextMenu is gekoppeld aan een specifiek besturingselement. Met het element ContextMenu kunt u een lijst met items presenteren aan gebruikers die opdrachten of opties aangeven die zijn gekoppeld aan een bepaald besturingselement, bijvoorbeeld een Button. Gebruikers rechtsklikken op het element om het menu weer te geven. Bij het klikken op een MenuItem wordt meestal een submenu geopend of laat een toepassing een opdracht uitvoeren.

Contextmenu's maken

In de volgende voorbeelden ziet u hoe u een ContextMenu maakt met submenu's. De ContextMenu besturingselementen zijn gekoppeld aan knopbesturingselementen.

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

Stijlen toepassen op een contextmenu

Met behulp van een besturingselement Stylekunt u het uiterlijk en gedrag van een ContextMenu aanzienlijk wijzigen zonder een aangepast besturingselement te schrijven. Naast het instellen van visuele eigenschappen kunt u ook stijlen toepassen op onderdelen van een besturingselement. U kunt bijvoorbeeld het gedrag van onderdelen van het besturingselement wijzigen met behulp van eigenschappen, of u kunt onderdelen toevoegen aan of de indeling van een ContextMenuwijzigen. In de volgende voorbeelden ziet u verschillende manieren om stijlen toe te voegen aan ContextMenu besturingselementen.

In het eerste voorbeeld wordt een stijl gedefinieerd met de naam SimpleSysResources, die laat zien hoe u de huidige systeeminstellingen in uw stijl gebruikt. In het voorbeeld wordt MenuHighlightBrushKey toegewezen als de Background kleur en MenuTextBrushKey als de Foreground kleur van de 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>

In het volgende voorbeeld wordt het Trigger-element gebruikt om het uiterlijk van een Menu te wijzigen als reactie op gebeurtenissen die worden gegenereerd op de ContextMenu. Wanneer een gebruiker de muisaanwijzer over het menu beweegt, verandert het uiterlijk van de ContextMenu items.

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

Zie ook