Voir le flux RSS

Blog de Serge Girard (aka SergioMaster)

[FMX] Non, un style n'est pas gravé dans le marbre

Noter ce billet
par , 07/05/2020 à 11h34 (131 Affichages)
Point d'entrée de ce billet, une discussion du forum demandant un TLabel avec bordures, du moins est-ce ainsi que je l'avais interprété

L'objectif était donc de tracer un cadre autour d'un TLabel et, soyons fou, de pouvoir cacher certaines des bordures en fonction de nos envies.
Nom : Objectif_1.PNG
Affichages : 611
Taille : 2,1 Ko
Bien sûr, le premier réflexe est d'appeler le menu contextuel d'un composant TLabel (clic droit) et de sélectionner l'option "Modifier un style personnalisé".
Un peu de manipulations, relativement fastidieuses (il faut faire attention à toutes les propriétés des composants ajoutés), notre style personnalisé est prêt.
Nom : border_v1.PNG
Affichages : 36
Taille : 11,5 Ko
Appliquons ensuite ce style au composant, après avoir bien pris soin d'appliquer le style et même par précaution de fermer l'onglet du "concepteur de style", tout simplement en changeant la propriété stylebook du TLabel visé, c'est gagné.
Toutefois maintenant que les bordures apparaissent, encore faut-il pouvoir les faire disparaitre ou apparaitre à volonté. Contrairement aux idées reçues un style n'est pas complètement "gravé dans le marbre", un peu de code va pouvoir faire changer l'apparence.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
procedure TForm1.SetBorders(pLabel: TLabel; bLeft, bTop, bBottom,
  bRight: Boolean);
begin
if sametext(pLabel.stylelookup,'borderedlabelstyle') then  // contrôle du style
 begin
   pLabel.StylesData['bordgauche.visible']:=bLeft;
   pLabel.StylesData['bordhaut.visible']:=bTop;
   pLabel.StylesData['borddroit.visible']:=bRight;
   pLabel.StylesData['bordbas.visible']:=bBottom;
 end;
end;
vous trouverez une autre sorte de code dans le fil de la discussion citée au début.

Encore plus fou ? Au lieu d'utiliser des composants TLine, utilisé un TRectangle va permettre de "jouer" non seulement avec les bords mais aussi avec le fond.
Nom : border_v2.PNG
Affichages : 35
Taille : 23,7 Ko
Le code change un peu car les bords sont gérés dans un objet TSides.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
var  cotes : TSides;
begin
// nécessite l'ajout de l'unité System.RTTI
if sametext(pLabel.stylelookup,'borderedlabelstyle') then
 begin
   Cotes:=[];
   if bTop then Cotes:=Cotes+[TSide.Top];
   if bLeft then Cotes:=Cotes+[TSide.Left];
   if bBottom then Cotes:=Cotes+[TSide.Bottom];
   if bRight then Cotes:=Cotes+[TSide.Right];
   pLabel.StylesData['fond.sides']:= TValue.From(Cotes);
 end;
Mais le principe reste le même.
Changer la couleur ? Label1.StylesData['fond.fill.color']:=Random($ffffffff); // couleur au hasard Oui, vous l'avez peut-être remarqué sur l'image précédente, j'en ai même profité pour triturer un style pour le TEdit.
Étrangement pas de text dans l'arborescence, ce qui peut s'avérer déstabilisant.

Comment ai-je procédé ? En fait ma seule astuce fut d'avoir tout d'abord posé un premier TStyleBook et y avoir chargé un fichier style de mon choix (j'avoue avoir une préférence marquée pour le style Calypso). Il m'a suffi alors de rechercher le style standard d'un TEdit (editstyle) et de le copier. Je retourne alors sur mon style personnalisé, j'y colle ce style standard à la racine et je n'ai plus qu'alors qu'à renommer et customiser (ajout du TRectangle).

Cerise sur le gâteau, changer le style de la forme le composant s'adapte et ce sans avoir modifié le fichier style (en exemple : utilisation du fichier UbuntuClearFantasy)
Nom : runtime.PNG
Affichages : 34
Taille : 59,9 Ko
Parfait ? Non pas totalement, sur cette dernière image, le style UbuntuClearFantasy montre un cadre aux bords arrondis
Plus ennuyeux, les couleurs des fontes, si dans ces deux derniers styles la fonte du texte est blanche dans d'autres elle sera noire et mon style modifié n'en tient pas compte.
Qu'à cela ne tienne, supprimer foreground, selection et font de mon style personnalisé et je retrouve la bonne couleur.
Nom : diamond2.PNG
Affichages : 37
Taille : 410,8 Ko
Cela dit, ce n'est pas encore parfait mais ...

À cela vous pouvez me rétorquer que cette peine était bien inutile, qu'il suffisait de poser un TRectangle sur la forme et que de dernier ait comme enfant le composant. C'est totalement vrai, cette "étude" peut donc sembler totalement inutile, mais, essayez donc de mettre un bouton dans un onglet d'un TTabControl

En conclusion, je vous ai montré :
  • Que le style d'un composant pouvait quand même être modifié à l'exécution.
  • Que plusieurs styles peuvent cohabiter (un style provenant d'un fichier qui ne sera pas modifié et un style personnalisé)

Quels mécanismes entrent en jeu ? Une hiérarchie dans la recherche du style à appliquer. Mais, jusqu'à plus ample maitrise de ma part je vous laisse faire vos propres recherches.

Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog Viadeo Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog Twitter Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog Google Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog Facebook Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog Digg Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog Delicious Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog MySpace Envoyer le billet « [FMX] Non, un style n'est pas gravé dans le marbre » dans le blog Yahoo

Tags: fmx, style
Catégories
Programmation , Delphi , FMX

Commentaires