Partager via


SimpleMenu et SimpleMenuItem

Cette page s’applique uniquement aux projets WPF

Le menu est un contrôle d’éléments qui organise hiérarchiquement les éléments associés aux commandes et aux gestionnaires d’événements. Vous pouvez placer du contenu dans un menu dans Microsoft Expression Blend en double-cliquant sur le menu et en y faisant glisser un élément (un rectangle par exemple). Vous pouvez également cliquer avec le bouton droit sur le menu sous Objets et chronologie, puis cliquer sur Ajouter SimpleMenuItem pour ajouter des éléments individuels à la collection, ou cliquer sur Lier ItemsSource aux données pour générer la collection d’éléments MenuItem à partir d’une source de données. Pour ajouter un élément de menu de second niveau, vous pouvez cliquer avec le bouton droit sur un élément de menu sous Objets et chronologie, puis cliquer sur Ajouter SimpleMenuItem, ou ajouter un élément de menu personnalisé depuis l’onglet Styles locaux de la Bibliothèque de composants Cc295350.0224cabd-5da1-4e01-bddd-4a647401a098(fr-fr,Expression.10).png.

Vous pouvez modifier l’élément de menu en cliquant avec le bouton droit sur l’élément de menu sous Objets et chronologie, et en cliquant ensuite sur Modifier le texte, ou vous pouvez activer l’élément de menu en double-cliquant dessus et en y dessinant un contrôle. Pour afficher les éléments de menu enfants d’un élément de menu sur la planche graphique alors qu’ils sont développés, vous pouvez cliquer avec le bouton droit sur l’élément de menu parent sous Objets et chronologie, puis cliquer sur Développer MenuItem.

Vue de planche graphique d’un contrôle SimpleMenu après l’ajout de deux éléments et d’un séparateur

Cc295350.6f7455aa-d548-46a9-b93c-4b1eaefe455d(fr-fr,Expression.10).png

Composition du modèle de contrôle

Le modèle de contrôle SimpleMenu est composé des éléments suivants :

  • Un panneau Grille, qui sert à contenir les multiples enfants dans le menu. La grille est également utilisée pour permettre à un concepteur d’interface utilisateur d’application d’ajouter plus facilement des éléments au modèle.

  • Un élément Border, qui est utilisé parce qu’il inclut une propriété BorderThickness pouvant être liée par modèle à la propriété BorderThickness du contrôle de menu auquel ce modèle est appliqué.

  • Un élément StackPanel, qui est contenu dans l’élément Grid et qui sert à disposer les éléments de menu. Par défaut, la propriété Orientation de l’objet StackPanel est réglé à Horizontal.

Le modèle de contrôle SimpleMenuItem est composé des éléments suivants :

  • Un panneau Grille, qui sert à contenir les multiples enfants dans l’élément de menu. La grille est également utilisée pour permettre à un concepteur d’ajouter plus facilement des éléments au modèle. Ce panneau Grille utilise le concept de partage de taille, permettant à chaque élément de menu d’être de la même largeur que tous les autres éléments du menu.

  • Un élément ContentPresenter nommé Icon, qui est lié à la propriété Icon de l’élément de menu auquel ce modèle est appliqué.

  • Un panneau Grille nommé GlyphPanel qui sert à afficher une case à cocher au cas où l’élément de menu est un élément pouvant être activé. Par défaut, l’élément Glyph est réduit, mais rendu visible par le déclencheur IsChecked.

  • Un élément ContentPresenter nommé HeaderHost, qui est lié à la propriété Header de l’élément de menu auquel ce modèle est appliqué. La liaison est définie dans la propriété ContentSource de l’élément HeaderHost.

  • Un panneau Grille nommé ArrowPanel, qui sert à fournir un moyen de développer l’élément de menu. Par défaut, le panneau ArrowPanel est réduit, mais rendu visible par le déclencheur Role = SubmenuHeader qui identifie l’élément de menu comme un en-tête de sous-menu (un élément de menu de second niveau ou de niveau inférieur ayant des éléments de menu enfants).

  • Un élément Popup nommé SubMenuPopup, qui est utilisé pour contenir des éléments de menu enfants existants. Ceux-ci sont placés dans un élément StackPanel qui est marqué comme hôte d’éléments de façon que cet élément de menu sache où placer ses éléments de menu enfants. Si vous souhaitez une organisation différente des éléments de menu, vous pouvez utiliser un panneau de disposition différent comme un WrapPanel en cliquant avec le bouton droit sur l’élément StackPanel sous Objets et chronologie, en pointant sur Modifier le type de disposition, et en sélectionnant un panneau.

    Liste d’objets : parties de base (modèle) d’un contrôle SimpleMenu (gauche) et d’un contrôle SimpleMenuItem (droite)

    Cc295350.3c30a1c8-c055-441a-86ee-6038a02a6087(fr-fr,Expression.10).pngCc295350.2183480e-56b0-4241-a8da-4be1527de135(fr-fr,Expression.10).png

Cc295350.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page

Déclencheurs de propriété utilisés

Des déclencheurs de propriété dans le modèle de contrôle sont utilisés pour que le contrôle réagisse aux changements de propriétés. Vous pouvez cliquer sur les éléments sous Déclencheurs dans le panneau Interaction pour voir les propriétés qui sont changées lorsqu’un déclencheur est actif. Par exemple, dans le modèle de l’élément de menu, lorsque la propriété IsChecked a la valeur True, cela signifie que l’élément de menu auquel le modèle est appliqué peut être activé, et l’élément GlyphPanel est donc rendu visible par le déclencheur.

Cc295350.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page

Pinceaux utilisés

Les ressources pinceau suivantes dans le dictionnaire de ressources SimpleStyles.xaml sont utilisées par les modèles SimpleMenu et SimpleMenuItem :

  • La propriété Background du menu est définie à l’aide de l’élément LightBrush, et est définie à l’aide de l’élément DisabledBackgroundBrush si IsEnabled a la valeur False.

  • La propriété Background du menu est définie à l’aide de l’élément NormalBorderBrush, et est définie à l’aide de l’élément DisabledBorderBrush si IsEnabled a la valeur False.

  • La propriété Background de l’élément SubMenuBorder est définie à l’aide de l’élément WindowBackgroundBrush.

  • La propriété BorderBrush de l’élément SubMenuBorder est définie à l’aide de l’élément SolidBorderBrush.

En outre, les modèles utilisent des liaisons à des couleurs système qui permettent aux contrôles d’utiliser les valeurs système par défaut. Dans de nombreux cas, vous pouvez changer ces pinceaux afin de pouvoir créer une conception unique. Vous pouvez le faire en modifiant les déclencheurs qui définissent les couleurs système.

Cc295350.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page

Recommandations et directives de conception

  • En général, utilisez un contrôle Grid comme racine de votre modèle si vous prévoyez qu’un concepteur ajoutera des éléments visuels à votre contrôle. Expression Blend recherche un panneau de disposition comme le contrôle Grid et l’active par défaut afin que de nouveaux éléments ajoutés à la planche graphique deviennent des éléments enfants du panneau de disposition.

  • Le contrôle Pop-up s’affiche au-dessus des autres contrôles. Cela est généralement souhaitable pour un menu. Le contrôle Popup a lui-même une logique qui permet de définir le décalage par rapport au contrôle parent à définir, par exemple, en attribuant à la propriété Placement la valeur « Droite ». Dans le cas d’un menu, son développement est contrôlé par une liaison au contrôle parent. Pour que le menu se développe correctement, vous devez conserver la liaison.

  • Ce panneau Grille racine pour le modèle d’élément de menu utilise le concept de partage de taille, permettant à chaque élément de menu d’être de la même largeur que tous les autres éléments du menu. Si vous souhaitez changer ce comportement, vous devez modifier la propriété SharedSizeGroup dans la vue XAML car Expression Blend n’affiche pas cette propriété dans le panneau Propriétés. Dans la plupart des cas, il n’est pas nécessaire de modifier la propriété SharedSizeGroup car elle permet un redimensionnement correct du menu. Vous pouvez avantageusement changer l’aspect de l’élément de menu en dessinant des éléments dans le panneau Grille racine du modèle d’élément de menu au lieu de réorganiser les colonnes ou leur contenu.

  • Certains des déclencheurs de modèles d’éléments de menu fonctionnent avec une propriété nommée Role. La propriété Role est définie selon le niveau de l’élément de menu dans la hiérarchie des menus. Si vous modifiez le modèle d’élément de menu, vous pourriez souhaiter conserver les déclencheurs basés sur le rôle. Le modèle qui est utilisé par le contrôle système MenuItem proprement dit est considérablement plus complexe que le modèle SimpleMenuItem. Le modèle de contrôle MenuItem utilise un style permettant d’alterner entre différents modèles de contrôle en fonction du rôle de l’élément de menu. SimpleMenuItem utilise un modèle simple pour cela, et est donc plus facile à modifier.

  • Pour modifier le modèle SimpleMenuItem, cliquez sur le bouton Modifier la ressource en regard du style SimpleMenuItem dans le panneau Ressources. Puis, dans le mode d’édition du style, cliquez avec le bouton droit sur Style sous Objets et chronologie, pointez sur Modifier des parties du contrôle (Modèle), puis cliquez sur Modifier le modèle ou sur Modifier une copie.

  • Pour plus d’informations sur la connexion d’un élément de menu à une commande, voir la vue d’ensemble de la classe Menu sur MSDN.

Cc295350.7e183f1f-37d8-4dcb-980c-19a5d61ca087(fr-fr,Expression.10).gifHaut de la page