Discussion :

[Jon Shannow]

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

[jurassic pork]

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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;

Ami calmant, J.P

[Jipété]

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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é :

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 :

Qui a cassé quoi ? )

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

Merci pour le coup de main,

[jurassic pork]

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

Ami calmant, J.P (sans T)

[Jipété]

Ah !

ÉNORME MERCI à toi !

[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

[Jipété]

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 :


et pendant que j'y étais, cette copie d'écran des couleurs, pour éviter de chercher (depuis le temps que je devais la faire...) :

Allez hop !, cadeau,

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

[Jon Shannow]

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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;

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

[Jipété]

... 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 ?

[Jon Shannow]

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

[Jipété]

... 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 ?

[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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[Jon Shannow]

Ç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.

[Jon Shannow]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[jurassic pork]

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

[Jon Shannow]

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

[jurassic pork]

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 :


Ne pas oublier de mettre types dans les uses

[Jon Shannow]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[jurassic pork]

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

[Jon Shannow]

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