Partager via

Vue d’ensemble de ContextMenu

  • Article

La ContextMenu classe représente l’élément qui expose les fonctionnalités à l’aide d’un contexte spécifique Menu. En règle générale, un utilisateur expose l’interface ContextMenu utilisateur dans l’interface utilisateur en cliquant avec le bouton droit sur le bouton de la souris. Cette rubrique présente l’élément ContextMenu et fournit des exemples d’utilisation dans XAML (Extensible Application Markup Language) et du code.

Contrôle ContextMenu

Un ContextMenu est attaché à un contrôle spécifique. L’élément ContextMenu vous permet de présenter aux utilisateurs une liste d’éléments qui spécifient des commandes ou des options associées à un contrôle particulier, par exemple un Button. Les utilisateurs cliquent avec le bouton droit sur le contrôle pour afficher le menu. En règle générale, cliquer sur un MenuItem sous-menu ou provoquer l’exécution d’une commande par une application s’ouvre.

Création d’un ContextMenu

Les exemples suivants montrent comment créer un ContextMenu sous-menu avec. Les ContextMenu contrôles sont attachés aux contrôles de bouton.

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

Application de styles à un ContextMenu

En utilisant un contrôle Style, vous pouvez changer considérablement l’apparence et le comportement d’un ContextMenu sans écrire de contrôle personnalisé. Outre la définition de propriétés visuelles, vous pouvez appliquer des styles aux parties d’un contrôle. Par exemple, vous pouvez modifier le comportement des parties du contrôle à l’aide de propriétés, ou vous pouvez ajouter des parties, ou modifier la disposition d’un ContextMenucontrôle. Les exemples suivants montrent plusieurs façons d’ajouter des styles aux ContextMenu contrôles.

Le premier exemple définit un style appelé SimpleSysResources, qui explique comment utiliser les paramètres système actuels dans votre style. L’exemple affecte MenuHighlightBrushKey la Background couleur et MenuTextBrushKey la Foreground couleur du 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>

L’exemple suivant utilise l’élément Trigger pour modifier l’apparence d’une Menu réponse aux événements déclenchés sur le ContextMenu. Lorsqu’un utilisateur déplace la souris sur le menu, l’apparence des ContextMenu éléments change.

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

Voir aussi