l’une des fonctionnalités clés de l’interface utilisateur de Windows Internet Explorer est la barre d’outils. Il permet non seulement aux utilisateurs d’accéder à une grande variété de fonctionnalités, mais également aux utilisateurs de personnaliser leur disposition en fonction de leurs préférences personnelles.
La capture d’écran suivante montre la barre d’outils d’Internet Explorer et met en évidence certaines des fonctionnalités clés.

Cette barre d’outils se compose essentiellement d’un contrôle rebar avec quatre bandes : trois barres d’outils et une barre de menus. Comme elle est implémentée avec l’API de contrôles communs, les développeurs peuvent créer des barres d’outils avec tout ou partie de ses fonctionnalités. Cette rubrique décrit les fonctionnalités essentielles de la barre d’outils d’Internet Explorer et comment les implémenter dans votre application.
Contrôle rebar
La structure sous-jacente de la barre d’outils d’Internet Explorer est fournie par un contrôle rebar. Ce contrôle permet aux utilisateurs de personnaliser la disposition d’une collection d’outils. Chaque Rebar contient une ou plusieurs bandes, qui sont généralement des rectangles étroits longs qui contiennent une fenêtre enfant, généralement un contrôle ToolBar.
Le contrôle rebar affiche ses bandes dans une zone rectangulaire, en général en haut de la fenêtre. Ce rectangle est subdivisé en une ou plusieurs bandes qui correspondent à la hauteur d’une bande. Chaque bande peut se trouver sur une bande distincte, ou plusieurs bandes peuvent être placées sur la même bande.
Un contrôle rebar offre aux utilisateurs deux moyens de réorganiser leurs outils :
- Chaque bande possède généralement une pince sur son bord gauche. Les pinceaux sont utilisés lorsque deux ou plusieurs bandes sur une seule bande dépassent la largeur de la fenêtre. En faisant glisser la pince vers la gauche ou la droite, les utilisateurs peuvent contrôler la quantité d’espace allouée à chaque bande.
- Les utilisateurs peuvent déplacer les bandes dans le rectangle d’affichage du Rebar en les faisant glisser. Le contrôle rebar change ensuite l’affichage pour s’adapter à la nouvelle disposition des bandes. Si toutes les bandes sont retirées d’une bande, la hauteur du Rebar sera réduite, ce qui augmentera la zone d’affichage.
Une application peut ajouter ou supprimer des bandes en fonction des besoins. En règle générale, les applications permettent aux utilisateurs de sélectionner les bandes qu’ils souhaitent afficher via le menu Affichage ou un menu contextuel.
Si la largeur combinée des bandes sur une bande dépasse la largeur de la fenêtre, le contrôle rebar ajuste leur largeur en fonction des besoins. Certains des outils peuvent être couverts par la bande adjacente.
La Version 5,80 des contrôles communs offre un moyen de rendre les outils couverts par une autre bande accessible à l’utilisateur. Si vous définissez l' _ indicateur RBBS USECHEVRON dans le membre fStyle de la structure REBARBANDINFO de la bande, un Chevron s’affiche pour les barres d’outils qui ont été couvertes. Lorsqu’un utilisateur clique sur le Chevron, un menu s’affiche pour lui permettre d’utiliser les outils cachés. La capture d’écran suivante de Microsoft Internet Explorer 6 affiche le menu qui s’affiche lorsqu’une partie de la barre d’outils standard est couverte.

Étant donné que chaque bande contient un contrôle, vous pouvez fournir une flexibilité supplémentaire par le biais de l’API du contrôle. Par exemple, vous pouvez implémenter la personnalisation de la barre d’outils pour permettre à l’utilisateur d’ajouter, de déplacer ou de supprimer des boutons sur une barre d’outils.
Implémentation du contrôle rebar
La plupart des fonctionnalités de la barre d’outils Internet Explorer sont réellement implémentées dans les bandes individuelles. L’implémentation du contrôle rebar lui-même est simple et est indiquée ci-dessous.
Créez le contrôle rebar avec CreateWindowEx. Définissez dwExStyle sur WS _ ex _ TOOLWINDOW et lpClassName sur REBARCLASSNAME. Internet Explorer utilise les styles de fenêtre suivants :
- _BANDBORDERS RBS
- _DBLCLKTOGGLE RBS
- _REGISTERDROP RBS
- _VARHEIGHT RBS
- CCS _ diviseur
- CCS _ NOPARENTALIGN
- _bordure WS
- _enfant WS
- _CLIPCHILDREN WS
- _CLIPSIBLINGS WS
- WS _ visible
Définissez les autres paramètres en fonction de votre application.
Créez un contrôle avec CreateWindowEx ou une fonction de création de contrôle spécialisée telle que CreateToolbarEx.
Initialisez une bande pour le contrôle en remplissant les membres de REBARBANDINFO. Incluez le _ style RBBS USECHEVRON avec le membre fStyle pour activer les chevrons.
Ajoutez la bande au contrôle rebar avec un message RB _ INSERTBAND .
Répétez les étapes 2-4 pour les bandes restantes.
Implémentez des gestionnaires pour les notifications Rebar. En particulier, vous devez gérer RBN _ CHEVRONPUSHED pour afficher un menu déroulant lorsque l’utilisateur clique sur un chevron. Pour plus d’informations, consultez gestion des chevrons.
Les pinces sont incluses par défaut. Pour omettre la pince d’une bande, définissez l' _ indicateur NOHENSION RBBS dans le membre fStyle de la structure REBARBANDINFO de la bande. Pour plus d’informations sur l’implémentation des contrôles rebar, consultez à propos des contrôles Rebar.
Gestion des chevrons
Lorsqu’un utilisateur clique sur un chevron, le contrôle rebar envoie une notification RBN _ CHEVRONPUSHED à votre application. La structure NMREBARCHEVRON transmise avec la notification contient l’identificateur de la bande et une structure Rect avec le rectangle occupé par le Chevron. Votre gestionnaire doit déterminer les boutons qui sont masqués et afficher les commandes associées dans un menu contextuel.
La procédure suivante décrit comment gérer une notification _ CHEVRONPUSHED RBN :
- Récupérez le rectangle englobant actuel pour la bande sélectionnée en envoyant le contrôle rebar à un message RB _ GETRECT .
- Récupérez le nombre total de boutons en envoyant la barre d’outils du contrôle de la bande à un message _ BUTTONCOUNT to .
- En commençant par le bouton le plus à gauche, récupérez le rectangle englobant du bouton en envoyant au contrôle de barre d’outils un message _ GETITEMRECT to .
- Transmettez les rectangles de la bande et du bouton à la fonction IntersectRect . Cette fonction retourne une structure Rect qui correspond à la partie visible du bouton.
- Transmettez le rectangle du bouton et le rectangle de la partie visible du bouton à la fonction EqualRect .
- Si EqualRect retourne la valeur true, le bouton entier est visible. Répétez les étapes 3-5 pour le bouton suivant dans la barre d’outils. Si EqualRect retourne la valeur false, le bouton est au moins partiellement masqué et tous les autres boutons sont complètement masqués. Passez à l’étape suivante.
- Créez un menu contextuel contenant les éléments de chaque bouton masqué.
- Affichez le menu contextuel à l’aide de la fonction TrackPopupMenu . Utilisez le rectangle à chevrons qui a été transmis avec la notification _ CHEVRONPUSHED RBN pour positionner le menu. Le menu doit être immédiatement sous le Chevron, avec les bords gauches alignés.
- Gérer les commandes de menu.
Les barres d’outils
La majeure partie de la complexité de la barre d’outils d’Internet Explorer réside dans l’implémentation des contrôles qui composent les bandes rebar. Internet Explorer affiche généralement quatre bandes :
- Barre de menus
- Barre d’outils standard
- Barre d’outils liens
- Barre d’outils adresse
Toutes ces bandes, y compris la barre de menus, comportent en fait des contrôles ToolBar. Cette section décrit l’implémentation des barres d’outils standard et links. La barre de menus est un peu plus compliquée et est décrite séparément dans Guide pratique pour créer une barre de menus Explorer-Style Internet.
Les procédures de base pour l’implémentation des contrôles ToolBar sont décrites dans à propos des contrôles ToolBar. Cette section se concentre sur certaines des nouvelles fonctionnalités de la barre d’outils utilisées par Internet Explorer pour améliorer la convivialité du contrôle.
Boutons déroulants
Les boutons déroulants prennent en charge plusieurs commandes. Quand l’utilisateur clique sur un bouton déroulant, le bouton affiche un menu contextuel au lieu de lancer une commande. L’utilisateur lance une commande en la sélectionnant dans le menu. La capture d’écran suivante montre un bouton et un menu déroulants à partir de la barre d’outils standard d’Internet Explorer.

La fonctionnalité de liste déroulante peut être ajoutée à n’importe quel style de bouton en ajoutant un indicateur de style au membre fStyle de la structure TBBUTTON du bouton. Il existe trois styles de bouton déroulant, tous utilisés par Internet Explorer :
Les boutons déroulants bruts ont le style de _ liste déroulante BTNS . Ils ressemblent à des boutons normaux, mais ils affichent un menu lorsque vous cliquez dessus au lieu de lancer une commande.
Les boutons fléchés déroulants simples ont le style BTNS _ WHOLEDROPDOWN . Elles ont une flèche affichée en regard de l’image ou du texte du bouton. À part la différence de l’apparence, elles sont identiques aux boutons déroulants bruts. Le bouton courrier utilisé comme exemple dans l’illustration précédente est un bouton de flèche déroulante.
Les boutons de liste déroulante qui ajoutent le style étendu TBSTYLE _ ex _ DRAWDDARROWS à la _ liste déroulante BTNS comportent une flèche séparée du texte ou de l’image. Ce style de bouton combine les fonctionnalités des boutons déroulants et standard. Si l’utilisateur clique sur la flèche, un menu s’affiche et l’utilisateur peut choisir parmi plusieurs commandes. Si l’utilisateur clique sur le bouton adjacent, il lance une commande par défaut. La capture d’écran suivante montre le bouton précédent d’Internet Explorer, qui utilise une flèche séparée.

Quand l’utilisateur clique sur un bouton déroulant avec les styles de flèche simple ou simple, le contrôle de barre d’outils envoie une notification de _ liste déroulante TBN à votre application. Lorsque votre application reçoit ce message, elle est responsable de la création et de l’affichage du menu, ainsi que de la gestion de la commande sélectionnée.
Quand l’utilisateur clique sur une flèche séparée, le contrôle de barre d’outils envoie une notification de _ liste déroulante TBN à votre application. Votre application doit la gérer de la même façon qu’elle gère les deux autres types de boutons déroulants. Si l’utilisateur clique sur le bouton principal, votre application reçoit un message de _ commande WM avec l’ID de commande du bouton, comme s’il s’agissait d’un bouton standard. Les applications répondent généralement en lançant la commande top dans le menu déroulant, mais vous êtes libre de répondre de manière appropriée.
Boutons List-Style
Avec les boutons standard, si vous ajoutez du texte, il est affiché sous l’image bitmap. La capture d’écran suivante montre les boutons recherche et favoris d’Internet Explorer avec un texte de bouton standard.

Microsoft Internet Explorer 5 et versions ultérieures utilisent le style de _ liste TBSTYLE . Le texte se trouve à droite de l’image bitmap, ce qui réduit la hauteur du bouton et l’agrandissement de la zone d’affichage. L’illustration suivante montre les boutons de recherche et de favoris d’Internet Explorer 6 avec le style de _ liste TBSTYLE .

Chevrons
Lorsque l’utilisateur réorganise les bandes dans le contrôle rebar, une partie d’une barre d’outils peut être couverte. Si la bande a été créée avec le _ style RBBS USECHEVRON, le contrôle rebar affiche un chevron sur le bord droit de la barre d’outils. L’utilisateur clique sur le Chevron pour afficher un menu avec les outils masqués.
Hot-Tracking
Lorsque le suivi à chaud est activé, un bouton devient actif lorsque le curseur se trouve sur celui-ci. Le bouton chaud se distingue normalement des autres boutons de la barre d’outils par une image distincte. Par défaut, un bouton actif semble être déclenché au-dessus du reste de la barre d’outils. Quand un nouveau bouton devient actif, votre application reçoit une notification TBN _ HOTITEMCHANGE . L’illustration suivante montre les boutons recherche et favoris d’Internet Explorer 5, avec un bouton de recherche à chaud. En plus d’avoir une apparence en relief, la bitmap grise du bouton a été remplacée par une image en couleur.

Pour activer le suivi à chaud, créez un contrôle de barre d’outils avec le style de _ liste TBSTYLE _ plat ou TBSTYLE. Celles-ci sont appelées barres d’outils plates , car les boutons individuels ne sont généralement pas mis en surbrillance de quelque manière que ce soit. Les bitmaps sont simplement affichées les unes à côté des autres. Ils prennent une apparence de type bouton uniquement lorsqu’ils sont à chaud. Ces deux styles sont également transparents, ce qui signifie que l’arrière-plan des icônes sera la couleur de la fenêtre du client sous-jacent.
Pour afficher une autre bitmap lorsque le bouton est actif, créez une deuxième liste d’images qui contient des images réactives pour tous les boutons de la barre d’outils. La taille et l’ordre de ces images doivent être les mêmes que dans la liste d’images par défaut. Envoyer le contrôle de barre d’outils à un message _ SETHOTIMAGELIST to pour définir la liste d’images réactives.
Rubriques connexes
Procédure de création d’une barre de menus Explorer-Style Internet