Procédure pas à pas : création d'un onglet personnalisé à l'aide du Concepteur de ruban

Article
08/10/2011

Cette procédure pas à pas montre comment créer un onglet du ruban personnalisé en utilisant le Concepteur de ruban. Vous pouvez utiliser le Concepteur de ruban pour ajouter et positionner des contrôles sur l'onglet personnalisé.

S'applique à : Les informations contenues dans cette rubrique s'appliquent aux projets de niveau document et de niveau application pour les applications suivantes : Excel 2007, Excel 2010, InfoPath 2007, InfoPath 2010, Outlook 2007, Outlook 2010, PowerPoint 2007, PowerPoint 2010, Project 2010; Visio 2010, Word 2007 et Word 2010. Pour en savoir plus, consultez Fonctionnalités disponibles par type d'application et de projet Office.

Cette procédure pas à pas décrit les tâches suivantes :

Création de volets Actions.
Création d'un onglet personnalisé.
Masquage et affichage de volets Actions à l'aide de boutons de l'onglet personnalisé.

Notes

Il est possible que pour certains des éléments de l'interface utilisateur de Visual Studio, votre ordinateur affiche des noms ou des emplacements différents de ceux indiqués dans les instructions suivantes. Ces éléments dépendent de l'édition de Visual Studio dont vous disposez et des paramètres que vous utilisez. Pour plus d'informations, consultez Utilisation des paramètres.

Composants requis

Pour exécuter cette procédure pas à pas, vous devez disposer des composants suivants :

Une édition de Visual Studio 2010 qui inclut les outils de développement Microsoft Office. Pour plus d'informations, consultez [Configuration d'un ordinateur pour développer des solutions Office](bb398242\(v=vs.100\).md).

Microsoft Office Excel 2007 ou Excel 2010.

lien vers la vidéo Pour obtenir une version vidéo de cette rubrique, consultez Vidéo : Comment créer un onglet personnalisé à l'aide du Concepteur de ruban (page éventuellement en anglais). Pour une démonstration vidéo connexe, consultez Comment faire pour utiliser le Concepteur de ruban pour personnaliser le ruban dans Excel ? (page éventuellement en anglais).

Création d'un projet de classeur Excel

Les étapes pour utiliser le Concepteur de ruban sont presque identiques pour toutes les applications Office. Cet exemple utilise un classeur Excel.

Pour créer un projet de classeur Excel

Créez un projet de classeur Excel et attribuez-lui le nom MyExcelRibbon. Pour plus d'informations, consultez Comment : créer des projets Office dans Visual Studio.

Visual Studio ouvre le nouveau classeur dans le concepteur et ajoute le projet MyExcelRibbon à l'Explorateur de solutions.

Création de volets Actions

Ajoutez deux volets Actions personnalisés au projet. Vous ajouterez ultérieurement des boutons à l'onglet personnalisé pour afficher et masquer ces volets Actions.

Pour créer des volets Actions

Dans le menu Projet, cliquez sur Ajouter un nouvel élément.
Dans la boîte de dialogue Ajouter un nouvel élément, sélectionnez ActionsPaneControl, puis cliquez sur Ajouter.

Le fichier ActionsPaneControl1.cs ou ActionsPaneControl1.vb s'ouvre dans le concepteur.
Dans l'onglet Contrôles communs de la Boîte à outils, ajoutez une étiquette à l'aire du Concepteur.
Dans la fenêtre Propriétés, affectez à la propriété Text de label1 la valeur Volet Actions 1.
Répétez les étapes 1 à 5 pour créer un deuxième volet Actions et une deuxième étiquette. Affectez à la propriété Text de la deuxième étiquette la valeur Volet Actions 2.

Création d'un onglet personnalisé

L'une des règles de conception d'une application Office stipule que les utilisateurs doivent toujours avoir le contrôle de l'interface utilisateur de l'application Office. Pour ajouter cette fonction pour les volets Actions, vous pouvez ajouter des boutons qui affichent et masquent chaque volet Actions à partir d'un onglet personnalisé sur le ruban. Pour créer un onglet personnalisé, ajoutez un élément Ruban (Concepteur visuel) au projet. Le concepteur vous permet d'ajouter et de position des contrôles, de définir les propriétés des contrôles et de gérer les événements de contrôle.

Pour créer un onglet personnalisé

Dans le menu Projet, cliquez sur Ajouter un nouvel élément.
Dans la boîte de dialogue Ajouter un nouvel élément, sélectionnez Ruban (Concepteur visuel).
Remplacez le nom du nouveau ruban par MyRibbon, puis cliquez sur Ajouter.

Le fichier MyRibbon.cs ou MyRibbon.vb s'ouvre dans le Concepteur de ruban et affiche un onglet et un groupe par défaut.
Dans le Concepteur de ruban, cliquez sur l'onglet par défaut.
Dans la fenêtre Propriétés, développez la propriété ControlId, puis affectez à la propriété ControlIdType la valeur Personnalisé.
Attribuez à la propriété ControlId la valeur Mon onglet personnalisé.
Dans le Concepteur de ruban, cliquez sur group1.
Dans la fenêtre Propriétés, affectez à Label la valeur Gestionnaire de volets Actions.
Dans l'onglet Contrôles de ruban Office de la Boîte à outils, faites glisser un bouton sur group1.
Cliquez sur button1 pour le sélectionner.
Dans la fenêtre Propriétés, affectez à Label la valeur Afficher volet Actions 1.
Ajoutez un deuxième bouton à group1 et affectez à la propriété Label la valeur Afficher volet Actions 2.
Dans l'onglet Contrôles de ruban Office de la Boîte à outils, faites glisser un contrôle ToggleButton sur group1.
Affectez à la propriété Label la valeur Masquer volet Actions.

Masquage et affichage de volets Actions à l'aide de boutons sur l'onglet personnalisé

La dernière étape consiste à ajouter le code qui répond à l'utilisateur. Ajoutez les gestionnaires d'événements pour les événements Click des deux boutons et l'événement Click du bouton bascule. Ajoutez le code aux gestionnaires d'événements qui masquent et affichent les volets Actions.

Pour masquer et afficher des volets Actions à l'aide de boutons dans l'onglet personnalisé

Dans l'Explorateur de solutions, cliquez avec le bouton droit sur MyRibbon.cs ou MyRibbon.vb et cliquez sur Afficher le code.

Ajoutez le code suivant en haut de la classe MyRibbon. Ce code crée deux objets du volet Actions.

Dim actionsPane1 As New ActionsPaneControl1()
Dim actionsPane2 As New ActionsPaneControl2()

ActionsPaneControl1 actionsPane1 = new ActionsPaneControl1();
ActionsPaneControl2 actionsPane2 = new ActionsPaneControl2();

Remplacez la méthode MyRibbon_Load par le code suivant. Ce code ajoute les objets du volet Actions à la collection ActionsPane.Controls et masque les objets. Le code Visual C# attache également les délégués à plusieurs événements de contrôle du ruban.

Private Sub MyRibbon_Load(ByVal sender As System.Object, ByVal e As RibbonUIEventArgs) Handles MyBase.Load
    Globals.ThisWorkbook.ActionsPane.Controls.Add(actionsPane1)
    Globals.ThisWorkbook.ActionsPane.Controls.Add(actionsPane2)
    actionsPane1.Hide()
    actionsPane2.Hide()
    Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = False
End Sub

private void MyRibbon_Load(object sender, RibbonUIEventArgs e)
{
    Globals.ThisWorkbook.ActionsPane.Controls.Add(actionsPane1);
    Globals.ThisWorkbook.ActionsPane.Controls.Add(actionsPane2);
    actionsPane1.Hide();
    actionsPane2.Hide();
    Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = false;

    // Use the following code in projects that target the .NET Framework 4.
    this.button1.Click += new Microsoft.Office.Tools.Ribbon.RibbonControlEventHandler(
        this.button1_Click);
    this.button2.Click += new Microsoft.Office.Tools.Ribbon.RibbonControlEventHandler(
        this.button2_Click);
    this.toggleButton1.Click += new Microsoft.Office.Tools.Ribbon.RibbonControlEventHandler(
        this.toggleButton1_Click);

    // For .NET Framework 3.5 projects, use the following code instead.
    // this.button1.Click += new EventHandler<RibbonControlEventArgs>(button1_Click);
    // this.button2.Click += new EventHandler<RibbonControlEventArgs>(button2_Click);
    // this.toggleButton1.Click += new EventHandler<RibbonControlEventArgs>(toggleButton1_Click);
}

Pour plus d'informations sur les différences entre les projets qui ciblent .NET Framework 4 et .NET Framework 3.5 dans l'exemple de code Visual C#, consultez Mise à jour des personnalisations de ruban dans les projets Office qui font l'objet d'une migration vers .NET Framework 4.

Ajoutez les trois méthodes de gestionnaire d'événements suivantes à la classe MyRibbon. Ces méthodes gèrent les événements Click des deux boutons et l'événement Click du bouton bascule. Les gestionnaires d'événements pour button1 et button2 affichent d'autres volets Actions. Le gestionnaire d'événements pour toggleButton1 affiche et masque le volet Actions actif.

Private Sub Button1_Click(ByVal sender As System.Object, _
    ByVal e As Microsoft.Office.Tools.Ribbon.RibbonControlEventArgs) _
        Handles Button1.Click
    Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = True
    actionsPane2.Hide()
    actionsPane1.Show()
    ToggleButton1.Checked = False
End Sub

Private Sub Button2_Click(ByVal sender As System.Object, _
    ByVal e As Microsoft.Office.Tools.Ribbon.RibbonControlEventArgs) _
        Handles Button2.Click

    Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = True
    actionsPane1.Hide()
    actionsPane2.Show()
    ToggleButton1.Checked = False

End Sub


Private Sub ToggleButton1_Click(ByVal sender As System.Object, _
    ByVal e As Microsoft.Office.Tools.Ribbon.RibbonControlEventArgs) _
        Handles ToggleButton1.Click

    If ToggleButton1.Checked Then
        Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = False
    Else
        Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = True
    End If

End Sub

private void button1_Click(object sender, RibbonControlEventArgs e)
{
    Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = true;
    actionsPane2.Hide();
    actionsPane1.Show();
    ToggleButton1.Checked = false;
}

private void button2_Click(object sender, RibbonControlEventArgs e)
{
    Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = true;
    actionsPane1.Hide();
    actionsPane2.Show();
    ToggleButton1.Checked = false;

}

private void toggleButton1_Click(object sender, RibbonControlEventArgs e)
{
    if (toggleButton1.Checked == true)
    {
        Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = false;
    }
    else
    {
        Globals.ThisWorkbook.Application.DisplayDocumentActionTaskPane = true;
    }

}

Test de l'onglet personnalisé

Lorsque vous exécutez le projet, Excel démarre. L'onglet Mon onglet personnalisé apparaît dans le ruban. Cliquez sur les boutons de Mon onglet personnalisé pour afficher et masquer les volets Actions.

Pour tester l'onglet personnalisé

Appuyez sur F5 pour exécuter votre projet.
Cliquez sur l'onglet Mon onglet personnalisé.
Dans le groupe Gestionnaire de volets Actions personnalisées, cliquez sur Afficher volet Actions 1.

Le volet Actions apparaît et affiche l'étiquette Volet Actions 1.
Cliquez sur Afficher volet Actions 2.

Le volet Actions apparaît et affiche l'étiquette Volet Actions 2.
Cliquez sur Masquer volet Actions.

Les volets Actions ne sont plus visibles.

Étapes suivantes

Pour plus d'informations sur la personnalisation de l'interface utilisateur d'Office, consultez les rubriques suivantes :

Ajouter une interface utilisateur contextuelle à une personnalisation au niveau du document. Pour plus d'informations, consultez Vue d'ensemble du volet Actions.
Étendre un formulaire Microsoft Office standard ou personnalisé. Pour plus d'informations, consultez Procédure pas à pas : conception d'une zone de formulaire Outlook.

Voir aussi

Historique des modifications

Date	Historique	Motif
Septembre 2010	Ajout d'un exemple de code .NET Framework 3.5.	Résolution des bogues de contenu.
Septembre 2010	Ajout d'étapes pour garantir que cette procédure pas à pas ait pour résultat la création d'un onglet personnalisé. Avant cette modification, les contrôles apparaissaient uniquement dans l'onglet Compléments.	Résolution des bogues de contenu.

Septembre 2010

Ajout d'un exemple de code .NET Framework 3.5.

Résolution des bogues de contenu.