Partager via

Déclaration de commandes et de contrôles avec balisage du ruban

  • Article

L’infrastructure du ruban Windows utilise un langage de balisage basé sur XAML (Extensible Application Markup Language) pour implémenter de manière déclarative l’apparence d’une application ruban.

Séparation de la présentation de la logique de commande

La séparation des attributs de présentation et des attributs visuels de la logique de commande dans l’infrastructure du ruban s’effectue par le biais de deux plateformes de développement distinctes, mais dépendantes. Les dispositions de contrôle, les comportements de mise à l’échelle, les déclarations de commande et les spécifications de ressources sont le domaine au moment de la conception d’une syntaxe de balisage déclarative basée sur la spécification XAML (Extensible Application Markup Language). Les fonctionnalités de bas niveau, les hooks d’application et les gestionnaires de commandes sont définis dans les implémentations d’interface basées sur le modèle objet de composant (COM).

Cette séparation de la présentation et de la logique offre les avantages suivants :

  • Un cycle de développement d’applications plus efficace qui permet aux développeurs et aux concepteurs d’interface utilisateur d’implémenter l’interface graphique graphique de l’application ruban indépendamment de la fonctionnalité principale de l’application. Cette fonctionnalité de base peut être laissée aux développeurs de logiciels dédiés.
  • Maintenance moins coûteuse, car les modifications apportées à l’interface graphique graphique sont possibles sans modifier les fonctionnalités principales (et vice versa).
  • Spécification simple des ressources de chaîne et d’image via le balisage.
  • Facilité de prototypage.

Structure de balisage

Il existe deux branches distinctes au sein de la structure du balisage de l’infrastructure du ruban.

La première branche contient un manifeste de déclarations de commande et de ressources (chaînes et images). Chaque entrée de commande est utilisée par l’infrastructure pour lier un contrôle ruban, via un ID de commande, à un gestionnaire de commandes défini dans le code de l’application.

La deuxième branche contient les déclarations de contrôle réelles. Chaque contrôle est associé à une commande par le biais d’un attribut CommandName qui correspond à un attribut Name spécifié dans chaque déclaration De commande.

Composants du ruban

Les fonctionnalités de l’interface utilisateur de l’infrastructure du ruban sont exposées via des vues. Une vue est essentiellement un conteneur, tel que ribbon et ContextPopup, qui est utilisé pour présenter les contrôles d’infrastructure et les commandes auxquels ils sont liés.

L’affichage ruban se compose de plusieurs composants qui incluent un menu Application, la barre d’outils Accès rapide (QAT) pour afficher les commandes couramment utilisées à partir de l’interface utilisateur du ruban, les onglets principaux et contextuels qui contiennent des groupes de contrôles, ainsi que le système de menu contextuel riche du ContextPopup.

Tous les composants du ruban sont déclarés dans un fichier de balisage autonome qui :

Les deux exemples de balisage de ruban suivants montrent comment un ensemble d’éléments de menu application du ruban sont associés à un nom de commande et à un ID.

  1. Cette section présente les déclarations de commande requises pour un menu Application avec des commandes de base telles que Nouveau, Ouvrir et Enregistrer.

    <!-- Command declarations for the Application Menu. -->
<Command Name="cmdFileMenu"
         Symbol="ID_FILE_MENU"
         Id="25000" />
<!-- Command declaration for most recently used items. -->
<Command Name="cmdMRUItems"
         Symbol="ID_FILE_MRUITEMS"
         Id="25050"/>
<!-- Command declarations for Application Menu items. -->
<Command Name="cmdNew"
         Symbol="ID_FILE_NEW"
         Comment="New"
         Id="25001"
         LabelTitle="&amp;New"/>
<Command Name="cmdOpen"
         Symbol="ID_FILE_OPEN"
         Comment="Open"
         Id="25002"
         LabelTitle="&amp;&amp;Open"/>
<Command>
  <Command.Name>cmdSave</Command.Name>
  <Command.Symbol>ID_FILE_SAVE</Command.Symbol>
  <Command.Comment>Save</Command.Comment>
  <Command.Id>25003</Command.Id>
  <Command.LabelTitle>
    <String>
      <String.Content>Label for Save</String.Content>
      <String.Id>59999</String.Id>
      <String.Symbol>strSave</String.Symbol>
    </String>
  </Command.LabelTitle>
  <Command.TooltipTitle>Tooltip title with &amp;&amp; for Save Command</Command.TooltipTitle>
  <Command.TooltipDescription>Tooltip description for Save Command.</Command.TooltipDescription>
  <Command.Keytip>s1</Command.Keytip>
</Command>
<Command Name="cmdPrint"
         Symbol="ID_FILE_PRINT"
         Comment="Save"
         Id="25004"
         LabelTitle="Print" />
<Command Name="cmdExit"
         Symbol="ID_FILE_EXIT"
         Comment="Exit"
         Id="25005"
         LabelTitle="Exit" />

  2. Cette section présente les déclarations de contrôle associées.

    <!-- Control declarations for Application Menu items. -->
<Ribbon.ApplicationMenu>
  <ApplicationMenu CommandName="cmdFileMenu">
    <!-- Most recently used items collection. -->
    <ApplicationMenu.RecentItems>
      <RecentItems CommandName="cmdMRUItems"/>
    </ApplicationMenu.RecentItems>
    <!-- Menu items collection. -->
    <MenuGroup>
      <Button CommandName="cmdNew" />
      <Button CommandName="cmdOpen" />
      <Button CommandName="cmdSave" />
    </MenuGroup>
    <MenuGroup>
      <Button CommandName="cmdPrint" />
      <Button CommandName="cmdExit" />
    </MenuGroup>
  </ApplicationMenu>
</Ribbon.ApplicationMenu>

Lorsque le balisage est compilé avec l’outil UICC (UI Command Compiler), les noms et ID de commande sont placés dans un fichier d’en-tête utilisé par l’application hôte du ruban.

Voici un exemple de fichier d’en-tête généré par UICC.

// *****************************************************************************
// * This is an automatically generated header file for UI Element definition  *
// * resource symbols and values. Please do not modify manually.               *
// *****************************************************************************

#pragma once

#define cmdFileMenu 25000 
#define cmdNew 22001  /* New */ 
#define cmdNew_LabelTitle_RESID 60005
#define cmdOpen 22002  /* Open */ 
#define cmdOpen_LabelTitle_RESID 60006
#define cmdSave 22003  /* Save */ 
#define cmdSave_LabelTitle_RESID 60007
#define cmdSave_TooltipTitle_RESID 60008
#define cmdSave_TooltipDescription_RESID 60009

Xaml (Extensible Application Markup Language)

Compilation du balisage du ruban