Composant TreeView et couleur des noeuds

Version imprimable

26/05/2025, 15h39
Jon Shannow

Composant TreeView et couleur des noeuds

Bonjour à toutes et tous,

Est-ce que quelqu'un a déjà utilisé un TreeView en modifiant la couleur du texte d'un noeud en fonction d'un critère particulier ?

Je voudrais pouvoir modifier les couleurs du texte des noeuds, mais les TTreeNode n'ont pas de composants Font, et je ne vois pas comment dans le TTreeview réaliser cela.

Si quelqu'un a une idée, ou s'il existe un composant dérivé qui permet cela, merci d'avance pour votre aide.

JS

1 pièce(s) jointe(s)

Hello,
avec l'événement OnCustomDrawItem, tu dois pouvoir y arriver :

Code:

1
2
3
4
5
6
7
procedure TForm1.tv_eg1CustomDrawItem(Sender: TCustomTreeView; Node: TTreeNode;  State: TCustomDrawState; var DefaultDraw: Boolean);
begin
 If Node.Text = 'Root' then   Sender.Canvas.Font.Color := clBlue;
 If Node.Text = 'Node1' then   Sender.Canvas.Font.Color := clRed;
 If Node.Text = 'Node2' then   Sender.Canvas.Font.Color := clGreen;
 If Node.Text = 'Node3' then   Sender.Canvas.Font.Color := clLime;
end;

Pièce jointe 667714

Ami calmant, J.P

1 pièce(s) jointe(s)

[Treeview] Problème pour faire fonctionner un bout de code du forum

Citation:
Envoyé par jurassic pork
Hello,
avec l'événement OnCustomDrawItem, tu dois pouvoir y arriver :
Code:

1 2 3 4 5 6 7 procedure TForm1.tv_eg1CustomDrawItem(Sender: TCustomTreeView; Node: TTreeNode; State: TCustomDrawState; var DefaultDraw: Boolean); begin If Node.Text = 'Root' then Sender.Canvas.Font.Color := clBlue; If Node.Text = 'Node1' then Sender.Canvas.Font.Color := clRed; If Node.Text = 'Node2' then Sender.Canvas.Font.Color := clGreen; If Node.Text = 'Node3' then Sender.Canvas.Font.Color := clLime; end;
Bonjour,

j'aimerais bien savoir ce qu'il manque au petit bout de code posté par jurassic pork pour avoir un fonctionnement correct de ces 4 lignes chez moi (Linux Debian 12, Lazarus 3.8 et un code venant d'un cador du forum [https://forum.lazarus.freepascal.org...html#msg398314]) auquel je n'ai rien changé sauf l'ajout de la procédure CustomDrawItem et ça ne fonctionne pas ! Les textes restent en noir, point final.

Je savais que le Treeview c'était compliqué :

Citation:

But be warned: Custom drawing of TTreeView is very complex. It occurs in several stages (see the "Stage" parameter) and you must fully understand this drawing cycle otherwise this exercise will be quite frustrating...
https://forum.lazarus.freepascal.org...html#msg398341
https://forum.lazarus.freepascal.org...0;attach=42158
(j'ai mis deux liens, je ne sais plus lequel est le bon... Faut dire aussi qu'il m'apparait ce matin un problème avec dvlp, regardez la copie d'écran de ça en live :
Pièce jointe 667790
Qui a cassé quoi ? )

, mais pas à ce point-là...

Merci pour le coup de main,

01/06/2025, 18h31
jurassic pork

Hello Jipété,
il faut que la propriété tvoThemedDraw dans Options du TreeView soit à False.

Ami calmant, J.P (sans T)
01/06/2025, 20h50
Jipété

1 pièce(s) jointe(s)

Ah !

ÉNORME MERCI à toi !
Pièce jointe 667793
01/06/2025, 21h27
der§en

Pour répondre à un besoin similaire, la coloration des items, je le faisait en consultant le level des ttreenode:

https://docwiki.embarcadero.com/Libr...TreeNode.Level
02/06/2025, 08h47
Jipété

2 pièce(s) jointe(s)

Ah oui, ça peut être sympa : me suis appuyé sur l'éditeur de nodes pour en ajouter 5 tout en bas et j'ai joué avec les couleurs, ce qui donne ça :
Pièce jointe 667801

et pendant que j'y étais, cette copie d'écran des couleurs, pour éviter de chercher (depuis le temps que je devais la faire...) :
Pièce jointe 667802
Allez hop !, cadeau, 8-)

PS : l'éditeur du forum a retrouvé ses boutons.

Citation:
Envoyé par jurassic pork
Hello,
avec l'événement OnCustomDrawItem, tu dois pouvoir y arriver :
Code:

1 2 3 4 5 6 7 procedure TForm1.tv_eg1CustomDrawItem(Sender: TCustomTreeView; Node: TTreeNode; State: TCustomDrawState; var DefaultDraw: Boolean); begin If Node.Text = 'Root' then Sender.Canvas.Font.Color := clBlue; If Node.Text = 'Node1' then Sender.Canvas.Font.Color := clRed; If Node.Text = 'Node2' then Sender.Canvas.Font.Color := clGreen; If Node.Text = 'Node3' then Sender.Canvas.Font.Color := clLime; end;
Pièce jointe 667714

Ami calmant, J.P
Bonjour JP,
de retour d'un Loooong WE, je vois cette magnifique réponse. Merci à toi.
J'avais utilisé cet évènement, avec succès, à priori, mais si on demande à mettre en évidence la sélection, (propriété HotTrack) on perd le formatage et je n'ai pas trouvé comment faire pour modifier l'aspect lors de la sélection.
Il y a bien la propriété HotTrackColor, mais pas de "HotTrackFont" !
Du coup, j'ai ôté la mise en évidence de la sélection.

JS

02/06/2025, 09h56
Jipété

Citation:

Envoyé par Jon Shannow

... mais si on demande à mettre en évidence la sélection, (propriété HotTrack) on perd le formatage et je n'ai pas trouvé comment faire pour modifier l'aspect lors de la sélection.

Curieux... J'ai testé avec HotTrack à True et HotTrackColor avec clTeal et ma foi, ça fonctionne : en bougeant la souris sur un item, le pointeur devient "le doigt qui clique" et la couleur du texte change.

Qu'est-ce que tu appelles "le formatage" ?
As-tu bien pensé à décocher tvoThemedDraw ?
02/06/2025, 10h19
Jon Shannow

Citation:

Envoyé par Jipété

Curieux... J'ai testé avec HotTrack à True et HotTrackColor avec clTeal et ma foi, ça fonctionne : en bougeant la souris sur un item, le pointeur devient "le doigt qui clique" et la couleur du texte change.

Qu'est-ce que tu appelles "le formatage" ?
As-tu bien pensé à décocher tvoThemedDraw ?

Bonjour Jipété,

Quand je parle du formatage, c'est, par exemple, la mise en italique ou en gras.
Ensuite, il prend la couleur du HotTrackColor, mais on ne peut pas avoir une couleur différente en fonction d'un critère particulier du nœud.

JS
02/06/2025, 10h43
Jipété

Citation:

Envoyé par Jon Shannow

... on ne peut pas avoir une couleur différente en fonction d'un critère particulier du nœud.

Ça doit dépendre du critère, puisque par exemple, selon le text ou le level, tu peux avoir une couleur ou une autre, on l'a bien vu.
Toi, tu voudrais utiliser un autre critère ? Lequel ?

Hello,
quand on met hottrack à true, les événements customdrawitem se déclenchent quand on passe sur les noeuds.
Par exemple pour afficher le Node Node2 en bleu Aqua quand on passe dessus on peut utiliser le code :
Code:

1 2 3 4 5 6 7 8 9 10 11 procedure TForm1.tv_eg1CustomDrawItem(Sender: TCustomTreeView; Node: TTreeNode; State: TCustomDrawState; var DefaultDraw: Boolean); var R: TRect; begin R := Node.DisplayRect(true); if (PtInRect(R, sender.ScreenToClient(Mouse.CursorPos))) And (Node.Text = 'Node2') then begin Sender.Canvas.Font.Color := clAqua; end; end;
On regarde si il y a un Node sous le curseur et si c'est le Node Node2 on colore en Aqua
Ami calmant, J.P

02/06/2025, 13h40
Jon Shannow

Citation:

Envoyé par Jipété

Ça doit dépendre du critère, puisque par exemple, selon le text ou le level, tu peux avoir une couleur ou une autre, on l'a bien vu.
Toi, tu voudrais utiliser un autre critère ? Lequel ?

En fait, ça, j'ai réussi. C'est avec le HotTrack, qu'il me reste un souci.
Pour les critères, en fait j'associe les nœuds avec un objet via la propriété Data du TTreeNode, ça marche bien.

Citation:
Envoyé par jurassic pork
Hello,
quand on met hottrack à true, les événements customdrawitem se déclenchent quand on passe sur les noeuds.
Par exemple pour afficher le Node Node2 en bleu Aqua quand on passe dessus on peut utiliser le code :
Code:

1 2 3 4 5 6 7 8 9 10 11 procedure TForm1.tv_eg1CustomDrawItem(Sender: TCustomTreeView; Node: TTreeNode; State: TCustomDrawState; var DefaultDraw: Boolean); var R: TRect; begin R := Node.DisplayRect(true); if (PtInRect(R, sender.ScreenToClient(Mouse.CursorPos))) And (Node.Text = 'Node2') then begin Sender.Canvas.Font.Color := clAqua; end; end;
On regarde si il y a un Node sous le curseur et si c'est le Node Node2 on colore en Aqua
Ami calmant, J.P
Salut JP,

Tu es sûr ? Car, pour moi, le passage du curseur ou la sélection d'un nœud ne provoque pas le OnCustomDraw. Du coup, je ne peux pas modifier le comportement du Treeview.

JS

02/06/2025, 14h02
jurassic pork

1 pièce(s) jointe(s)

sous quel O.S et quelle version de Lazarus ?
sous Windows 11 Lazarus 3.6 :

Pièce jointe 667810
02/06/2025, 15h16
Jon Shannow

Citation:

Envoyé par jurassic pork

sous quel O.S et quelle version de Lazarus ?
sous Windows 11 Lazarus 3.6 :

Sous Linux Mint, dernière version de Lazarus.
Je re-revérifie que j'aurais pas fait une co****ie ce soir, et je te redis (là, j'ai pas accès à mon PC)

JS
02/06/2025, 17h36
jurassic pork

1 pièce(s) jointe(s)

Citation:

Envoyé par Jon Shannow

Sous Linux Mint, dernière version de Lazarus.
Je re-revérifie que j'aurais pas fait une co****ie ce soir, et je te redis (là, j'ai pas accès à mon PC)

Ben moi , ça fonctionne sous Lubuntu 22.04 Lazarus 3.2 :
Pièce jointe 667814

Ne pas oublier de mettre types dans les uses

Bonjour à toutes et tous,

Je reviens vers vous pour ce problème de TreeView.

Alors, je confirme que pour la couleur du texte, ça fonctionne, mais pas pour le style du texte.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
 
  Node : TTreeNode; State : TCustomDrawState; var DefaultDraw : Boolean);
Var
  bo_Hot    : Boolean;
  vDataNode : TNodeCompte;  //Information sur le compte
  R         : TRect;
 
begin
  R := Node.DisplayRect(True);
  bo_Hot := (PtInRect(R, Sender.ScreenToClient(Mouse.CursorPos)));
 
    If Assigned(Node.Data) Then
    Begin
      vDataNode := TNodeCompte(Node.Data);
      If vDataNode.CptStatut = ecptFerme Then //Teste si le compte est fermé
        If bo_Hot Then
        Begin
          sender.Canvas.Font.Style := [fsbold, fsItalic]; //Là, ça met la police en souligné
          sender.Canvas.Font.Color := clRed; //Mais la couleur est bonne
        end
        Else Begin
          sender.Canvas.Font.Style := [fsItalic]; //Là c'est bon
          sender.Canvas.Font.Color := clMaroon; //Là aussi
        end
      Else
        If bo_Hot Then
        Begin
          sender.Canvas.Font.Style := [fsBold]; //Se met en souligné
          sender.Canvas.Font.Color := clBlue; //La couleur est OK
        end
        Else Begin
          sender.Canvas.Font.Style := [];
          sender.Canvas.Font.Color := clAqua; //Là aussi, c'est bon
        End;
    end
    Else
      If cdsHot in State Then
        sender.Canvas.Font.Style := [fsBold] //Pas de gras, juste du souligné
      Else
        sender.Canvas.Font.Style := [];
End;

Les couleurs sont bonnes, et les comptes "fermés" sont bien en italique, sauf lors du passage de la souris, là, s'ils changent bien de couleur, ils sont souligné et abandonnent l'italique !

JS

03/06/2025, 15h54
jurassic pork

Citation:

Envoyé par Jon Shannow

Bonjour à toutes et tous,
Alors, je confirme que pour la couleur du texte, ça fonctionne, mais pas pour le style du texte.

Les couleurs sont bonnes, et les comptes "fermés" sont bien en italique, sauf lors du passage de la souris, là, s'ils changent bien de couleur, ils sont souligné et abandonnent l'italique !

Hello,
cela me paraît logique car avec le HotTrack on surligne le texte donc on force les attributs.

Ami calmant, J.P
03/06/2025, 19h49
Jon Shannow

Citation:

Envoyé par jurassic pork

Hello,
cela me paraît logique car avec le HotTrack on surligne le texte donc on force les attributs.

Ami calmant, J.P

C'est la conclusion à laquelle j'étais arrivé aussi. Tant pis, je vais faire sans.

JS