Barre de titre personnalisée pour les fiches VCL

De RAD Studio
Aller à : navigation, rechercher

Présentation

La propriété TForm.CustomTitleBar et le nouveau contrôle TTitleBarPanel vous permettent de personnaliser la barre de titre native d'une fiche VCL comme Windows Explorer, Google Chrome ou d'autres applications. Vous pouvez placer des contrôles VCL sur la barre de titre et peindre la barre de titre de façon personnalisée, ainsi que contrôler le dessin par défaut d'éléments tels que l'icône de la fenêtre et son libellé.

CustomTitleBarVCL.png

Remarque: La barre de titre personnalisée est prise en charge sur Windows 7 et versions ultérieures.

La prise en charge de la barre de titre personnalisée utilise la véritable barre de titre Windows native, et dépend de l'activation de DWM (Desktop Window Manager). En cas de désactivation d'Aero sur Windows 7, ou d'autres cas dans lesquels DWM n'est pas utilisé pour le rendu des fenêtres, la personnalisation de la barre de titre n'est pas prise en charge. Ce comportement est géré par le contrôle, mais vous pouvez vérifier vous-même le code en contrôlant la valeur de TForm.CustomTitleBar.Supported. Si elle est définie sur True, vous pouvez utiliser la barre de titre personnalisée.

Pour exploiter le plein potentiel de la barre de titre personnalisée, vous devez utiliser la propriété TForm.CustomTitleBar combinée à TTitleBarPanel placé sur la fiche. Le volet permet non seulement d'héberger les contrôles VCL, mais aussi d'activer des fonctionnalités avancées comme la personnalisation du dessin, même lorsque la barre de titre ne contient pas de contrôles personnalisés. En fait, la propriété TForm.CustomTitleBar représente les paramètres de la barre de titre de la fiche et TTitleBarPanel est le contrôle VCL utilisé pour représenter et accéder aux fonctionnalités avancées dans la barre de titre.

Attention: Les styles VCL autres que Platform ne fonctionnent pas dans la barre de titre.

Personnalisation de base

La classe VCL TForm comporte une nouvelle propriété, CustomTitleBar, qui vous permet de modifier des propriétés de base, comme l'affichage du libellé ou de l'icône, mais aussi de contrôler les fonctionnalités plus avancées comme le placement des contrôles.

Pour activer la personnalisation de la barre de titre, définissez TForm.CustomTitleBar.Enabled sur True. Notez que, dans le concepteur, la partie haute de votre fiche VCL comporte maintenant une zone ombrée bleue. Elle représente la zone de la fiche qui sera utilisée pour la barre de titre.

Emplacement du contrôle VCL

La barre de titre est implémentée via DwmExtendFrameIntoClientArea, ce qui signifie que votre fiche ne comporte pas de zone non-client. La barre de titre est restituée en utilisant à la fois la zone client et non-client, c'est-à-dire l'espace dans lequel vous pouvez placer des contrôles VCL. La barre de titre n'est donc pas compatible avec les autres contrôles qui utilisent la zone non-client, c'est-à-dire TMainMenu.

Tous les contrôles apparentés à la fiche via une propriété Align, comme alTop, s'ajustent correctement sur la zone de barre de titre. Cependant, un contrôle placé via les propriétés Left et Top (et qui a donc un positionnement absolu) reste statique et se superpose à la barre de titre. Vous devez donc ajuster son emplacement lorsque la barre de titre personnalisée est activée.

Nous vous recommandons de placer les contrôles sur votre fiche dans un TPanel aligné sur le client. Notez que vous pouvez aussi agrandir la hauteur de votre fiche pour occuper l'espace précédemment utilisé par la barre de titre.

Paramètres et dessin partiel personnalisé

Les paramètres suivants contrôlent le comportement de la barre de titre, en plus de contrôler certains scénarios de dessin (par exemple, l'absence de dessin de libellé sur la barre de titre), ce qui vous permet de gérer ces scénarios sans implémenter de dessin complet personnalisé.

  • CaptionAlignment : à utiliser pour spécifier où dessiner le libellé. Windows 10 dessine sur la gauche par défaut ; vous pouvez dessiner le libellé au centre, comme sous Windows 8, ou l'aligner à droite.
  • Control : définir ce contrôle sur un TTitleBarPanel placé sur la fiche. Se reporter à la section ci-dessous relative aux contrôles personnalisés sur une barre de titre.
  • Enabled : active ou désactive l'utilisation de la barre de titre personnalisée.
  • Height : hauteur de la barre de titre en pixels. Pour changer la hauteur de la barre de titre, désactivez SystemHeight, qui limite la barre de titre à la hauteur système par défaut. Ensuite, vous pouvez définir la propriété Height sur n'importe quelle valeur.
  • ShowCaption : vérifie si le libellé est dessiné.
  • ShowIcon : contrôle si l'icône de la fiche est dessinée sur le bord gauche de la barre de titre.
  • SystemHeight : lorsque ce contrôle est défini sur True, la hauteur de la barre de titre est toujours la valeur utilisée par les autres fenêtres sur l'écran en cours. Pour personnaliser la hauteur de la barre de titre, désactivez SystemHeight, puis saisissez une valeur dans la propriété Height.
  • SystemColors : contrôle si le libellé et les boutons de la barre de titre utilisent les mêmes couleurs ou des couleurs personnalisées lorsqu'ils sont actifs ou inactifs. Ce contrôle est utile lorsque vous voulez dessiner une barre de titre en utilisant des couleurs d'arrière-plan et de premier plan différentes de celles utilisées par le système, sans qu'un dessin complet personnalisé soit requis.
Lorsque ce contrôle est défini sur True, l'arrière-plan, le libellé et les boutons système sont dessinés en utilisant les couleurs par défaut du système comme les autres applications. Lorsqu'il est défini sur False, les couleurs fournies dans les propriétés de couleur (voir ci-dessous) sont utilisées.
Pour utiliser des couleurs personnalisées, vous devez placer un TTitleBarPanel sur la fiche et définir la propriété CustomTitleBar.Control pour ce contrôle, comme vous le feriez si vous placiez les contrôles sur la barre de titre. Et cela, même si le volet de la barre de titre est vide et ne contient pas de contrôle.

Dessin complet personnalisé

Vous pouvez entièrement personnaliser le rendu de la barre de titre en peignant et en dessinant dessus. Pour ce faire, vous devez placer un TTitleBarPanel sur la fiche et définir la propriété CustomTitleBar.Control pour ce contrôle, comme vous le feriez si vous placiez les contrôles sur la barre de titre. Et cela, même si le volet de la barre de titre est vide et ne contient pas de contrôle. Ensuite, créez un gestionnaire d'événement pour l'événement TTitleBarPanel.OnPaint.

L'événement TTitleBarPanel.OnPaint est appelé à la toute dernière étape de peinture. La peinture est appliquée par-dessus les autres éléments déjà dessinés sur la barre de titre, comme le libellé et les boutons système. Vous pouvez également utiliser les propriétés Rect pour personnaliser votre dessin. Les propriétés IconRect, FrameRect, ClientRect et CaptionButtonsRect vous permettent de savoir où sont placés les boutons système, les libellés, etc.

La peinture est appliquée sur une surface 32 bits. Les spécifications sont les mêmes que pour la peinture sur un cadre transparent sous Windows 7.

Boutons de libellés

Vous pouvez ajouter des boutons de libellés personnalisés à la barre de titre. Cette fonction est utilisée dans l'EDI pour ajouter les boutons Aide et Bureau à gauche des boutons Réduire/Agrandir/Fermer qui s'affichent normalement sur la barre de titre.

Pour ce faire, placez un TTitleBarPanel sur la fiche et définissez-le sur la propriété CustomTitleBar.Control de la fiche comme détaillé ci-dessus. Vous pouvez ensuite ajouter des boutons personnalisés via la propriété CustomButtons du volet. Il s'agit d'une collection de TCaptionButtonItem. Les boutons sont automatiquement disposés de droite à gauche en commençant par le côté gauche du bouton Réduire. Le bouton 0 de la collection est le plus à droite et le dernier bouton le plus à gauche. Sous Windows 7, il y a un petit espace entre le bouton Réduire et le premier bouton personnalisé.

Le composant TCaptionButtonItem représente un bouton sur la barre de titre. Il a les propriétés suivantes :

  • ButtonType : permet d'utiliser un bouton système, comme Fermer, Réduire ou Restaurer, d'ajouter un espace ou d'avoir un bouton entièrement personnalisé. En général, vous utiliserez le bouton personnalisé.
  • Enabled : en cas de désactivation, le bouton est dessiné et ne répond pas aux mouvements de la souris ou aux clics.
  • Hint : permet de spécifier l'affichage d'un conseil lorsque la souris passe au-dessus du bouton.
  • Visible : contrôle si le bouton est dessiné sur la barre de titre.
  • Width : contrôle la largeur du bouton.
  • OnClick : gestionnaire d'événement en cas de clic sur le bouton.
  • OnPaint : gestionnaire d'événement pour dessiner sur le bouton, comme un glyphe de bouton. Les boutons ne se connectent pas à une liste d'images.

Prise en charge de Windows 7 et Windows 10

La barre de titre personnalisée prend entièrement en charge Windows 7 et Windows 10, y compris pour les boutons de libellé :

TTitleBar.png

La barre de titre de RAD Studio sous Windows 7.

Remarque:

Les plates-formes Windows Vista ou antérieures ne sont pas prises en charge.

La barre de titre personnalisée est prise en charge sous Windows 8. Toutefois, quelques différences visuelles peuvent apparaître par rapport aux autres applications, comme la peinture sur les boutons système, lorsque vous personnalisez les couleurs (ils sont restitués comme des boutons Windows 10).

Contrôles personnalisés

Le contrôle TTitleBarPanel permet de placer les contrôles dans la zone de barre de titre de la fiche VCL. Ce conteneur fournit un support de conception pour les contrôles. Il maintient aussi la relation entre la fiche et la zone de barre de titre personnalisée.

Les contrôles placés sur la barre de titre doivent prendre en charge le dessin sur une surface 32 bits, comme sur un cadre transparent sous Windows 7. De manière générale, si un contrôle est restitué correctement sur un cadre transparent sous Windows 7, il sera restitué correctement sur la barre de titre sous Windows 7 et Windows 10. Il n'est pas rare qu'un contrôle ainsi placé soit restitué de façon incorrecte, même dans le concepteur. Dans ce cas, utilisez des propriétés comme DoubleBuffered pour les contrôles VCL normaux.

Pour placer les contrôles sur la barre de titre :

  • Dans la palette, localisez le contrôle TTitleBarPanel et placez-en un sur la fiche. Il apparaît en haut de la fiche.
  • Définissez la propriété CustomTitleBar.Control de votre fiche sur le nouveau volet de la barre de titre. Vous constaterez que le volet a une couleur d'arrière-plan bleue et affiche des boutons système à droite.
  • Vous avez aussi la possibilité de changer la propriété Height du volet de la barre de titre pour qu'elle corresponde à la propriété CustomTitleBar.Height. Seuls les contrôles associés à la hauteur de la barre de titre sont restitués sur la barre de titre elle-même.
  • Dans la palette, localisez un contrôle, par exemple TEdit, et placez-le sur le TTitleBarPanel avec ce contrôle :
    • Dans l'inspecteur d'objets, définissez la propriété DoubleBuffered du nouveau contrôle sur la valeur True.
    • Comme le TTitleBarPanel est un contrôle VCL normal, vous pouvez définir Align, Anchors et les autres propriétés de positionnement des contrôles qui y sont placés. Pour que le contrôle de saisie soit aligné immédiatement en regard des boutons système (à la façon d'une zone de recherche), faites-le glisser jusqu'à la position appropriée, puis changez la propriété Anchors pour supprimer akLeft et ajouter akRight.
VCL control.png
  • Dans la fiche, ajoutez un événement OnShow ou utilisez OnResize si vous voulez positionner manuellement les contrôles dans la barre de titre au lieu d'utiliser l'alignement ou les ancres. (Nous vous recommandons d'utiliser l'alignement et les ancres, car le positionnement via OnResize crée un décalage visuel avec la taille de la fenêtre). Vous pouvez vous référer aux propriétés IconRect, FrameRect, ClientRect et CaptionButtonsRect de CustomTitleBar pour positionner vos contrôles par rapport aux éléments connus de la barre de titre. Définissez la propriété Left du contrôle de saisie sur CaptionButtonsRect.Left moins la largeur de saisie moins une petite marge (à des fins d'esthétique visuelle seulement) en ajoutant la ligne de code suivante à votre gestionnaire d'événement :
 Edit1.Left := CustomTitleBar.CaptionButtonsRect.Left - Edit1.Width - 8;
TForm.png

Voir Aussi

Récupérée de « https://docwiki.embarcadero.com/RADStudio/Alexandria/f/index.php?title=Barre_de_titre_personnalisée_pour_les_fiches_VCL&oldid=215900 »