TStringGrid : une image en fond de ligne [partiellement résolu]

Version imprimable

01/08/2012, 00h16
Invité

TStringGrid : une image en fond de ligne [partiellement résolu]

Bonjour,

Je travaille encore un peu sur les TStringGrids de Lazarus, histoire de voir ce que je peux améliorer au niveau de l'esthétique.

J'aimerais reproduire un effet d'image en arrière plan de ligne quand le pointeur de la souris la survole, par exemple un dégradé de couleur ou un effet de relief au "fond" de la ligne survolée.

Pour l'instant j'en suis là.
http://www.selzig.com/1208010005/capture.png
Sous Ubuntu 12.04, cela donne ceci en action : video.avi

J'ai intercepté des évènements (LM_MOUSEMOVE et LM_MOUSEWHEEL). Mettre une image dans une cellule : OK [cf la FixedCols ici]... Mais placer une image en fond de cellule et y "coller" dessus le texte que contient la cellule, malgré tous mes efforts, c'est l'échec complet. Est-ce faisable ? Peut-on régler les problèmes de transaparence sous Win et Nux ?

Vous remarquerez sur la vidéo le merveilleux rendu d'Ubuntu 12.04 avec la version de Lazarus de son dépôt (0.9.30.2-2) ... La StringGrid de droite avec ses jolis traits marrons est une TStringGrid d'origine ! Heureusement sous 10.04 ou Debian, avec une version SVN de Lazarus/FPC, c'est correct. Une différence cependant de comportement : sous Windows quand la souris quitte la StringGrid, le fond de la dernière ligne survolée disparaît alors que sous Nux, par défaut avec le même code, le fond reste affiché. Cela se corrige mais il faut tout vérifier.

Cordialement. Gilles
01/08/2012, 09h28
mick605

Salut

Je n'ai pas bien compris. Tu cherches a avoir ton texte sur l'image de fond ? Si c'est cela, au moment ou tu dessines ton image de fond avec Draw, fais également un DrawText par dessus.

J'avais travaillé également sur l'esthétique des StringGrid, va voir ici, j'avais rencontré quelques problèmes :
http://www.developpez.net/forums/d11...s-tcustomgrid/

Si ça t’intéresse, je peux te filer ce que j'ai commencé (et abandonné)

Bonne chance

Bonjour,

La première partie est réglée : le problème rencontré était le suivant :
http://www.selzig.com/1208010005/SG2.png

Ici pour que cela soit visible : Canvas.Brush.Color := clGreen;
Code:

1 2 3 4 5 6 7 8 if (aCol >0 ) and (aRow >= FixedRows) and (arow = aRowSurvol) then begin { Dessin du fond } Canvas.Draw(aRect.Left+((aRect.Right-aRect.Left-Form1.Image2.Picture.Bitmap.Width) div 2), aRect.Top+((Arect.Bottom-aRect.Top-Form1.Image2.Picture.Bitmap.Height) div 2),Form1.Image2.Picture.Bitmap); { Texte } DrawText(Canvas.Handle, PChar(sTmp), Length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_LEFT or DT_END_ELLIPSIS); end;
La question était comment rendre le fond du Texte transparent ? Je cherchais "le Canvas.Brush.Color doit prendre quelle valeur ?" Dans mes rêves, j'aurais aimé qu'une commande Canvas.Brush.Color := clNone corresponde à ce que je cherchais... d'ailleurs je ne comprend pas ce clNone. Il correspond à quel cas qu'une couleur (éventuellement prédéfinie) ne pourrait pas remplacer ?

En réalité, il suffit de rajouter avant de dessiner le texte :

Code:

Canvas.Brush.style := bsClear;

Autre question en suspens : Quelle est la bonne méthode pour ajuster la largeur (pas la hauteur) du Bitmap à la taille de la cellule ?

Strech --> Non : le rendu est déplorable. De plus je ne veux pas calculer la taille du dessin dans chaque cellule... C'est beaucoup trop long. La fluidité du survol s'en ressent.
Créer une image pour chaque colonne par addition d'une bande verticale de 1 pixel (qui serait l'image par défaut) de manière à l'adapter à chaque ColWidth[]... avec une méthode en cas de déplacement ou redimensionnement de la colonne ? Le problème est qu'il faut créer un nombre important de TBitmap si la largeur des colonnes diffères. Une idée serait de créer le plus long (large) et de le découper à la bonne taille... Je dois avouer mes limites en matière de dessin. Je ne veux pas de bibliothèque sophistiquée. C'est jouable de manière simple cette approche ?

Cordialement. Gilles

01/08/2012, 12h28
tourlourou

Canvas.DrawRect (ou CopyRect ?) à partir d'un BitMap de largeur supérieure à la plus large colonne, mais ça oblige à connaître hauteur et largeur de la cellule...
01/08/2012, 13h21
mick605

Je ne comprends pas non plus le problème.

Pour ma part, j'utilisais un StretchDraw qui rendait très bien. Tout était fluide, le rendu donnait bien, donc tout allait bien.

Code:

Canvas.StretchDraw(CellRect(ACol, ARow), BmpSelect);

Ou BmpSelect était un bitmap contenant le dégradé, de largeur 1pixel, et d'une hauteur supérieure a la hauteur max d'une ligne.

Le résultat était très bien, très fluide, je m'en servais pour une surbrillance des cellules au survol de la souris. Je suis sous D2005 et Windows Seven. Regarde aussi du coté de DoubleBuffered.

Pour ta remarque, clNone est, je pense, une couleur définie par le système pour je ne sais quelle raison. Il ne s'agit pas d'une couleur de transparence, mais d'une vraie couleur donc.

Bonjour mick605,

J'ai lu la discussion à laquelle vous faites références. Je dois dire que cela ma dépasse complètement.

Ok j'ai adopté votre méthode. Le DrawStrech fonctionne effectivement bien pour l'allongement horizontal. Le résultat est moins satisfaisant pour l'étirement vertical, mais là, même en "découpant", je n'ai pas d'autre solution (sauf à mettre une image d'une hauteur très importante...). Enfin, ceci est moins important. En effet, cela semble rester fluide... J'essayerai avec un RowCount significatif.

Par contre je rencontre un autre problème que j'aurais aimé simplifier :
Code actuel :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 if (aCol >0 ) and (aRow >= FixedRows) and (arow = aRowSurvol) then begin { Dessin du fond } Canvas.StretchDraw(CellRect(ACol, ARow), Form1.Image2.Picture.Bitmap); //Canvas.Draw(aRect.Left+((aRect.Right-aRect.Left-Form1.Image2.Picture.Bitmap.Width) div 2), // aRect.Top+((Arect.Bottom-aRect.Top-Form1.Image2.Picture.Bitmap.Height) div 2),Form1.Image2.Picture.Bitmap); { Texte } Canvas.Brush.style := bsClear; //Après l'image si usage de TextOut //Déplacement InflateRect(aRect, -3, 0); {Décalage abscisse du texte} aRect.Right:= aRect.Right -3; {Nécessaire pour centrage et align. droite} if Columns[aCol-1].Alignment <> taCenter then DrawText(Canvas.Handle, PChar(sTmp), Length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_LEFT or DT_END_ELLIPSIS) else DrawText(Canvas.Handle, PChar(sTmp), Length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_CENTER or DT_END_ELLIPSIS) //Canvas.TextStyle -> Default TextStyle of TextRect not TextOut... donc end;
Résultat :

http://www.selzig.com/1208010005/SG3.png
Il existe un décalage horizontal entre l'affichage par défaut et le Drawtext... Savez-vous à quelle variable implantée dans le code de Lazarus il correspond ?

Rq : valable également pour Canvas.TextOut(aRect.Left +3,aRect.Top +2,sTmp);
Mais avec TextOut il faut régler en plus le problème de l'ordonnée notammant pour le centrage vertical.

=> Donc pour l'instant adoption de DrawText qui me semble plus simple.

Cordialement. Gilles

02/08/2012, 13h47
mick605

Salut

Pour la discussion, mon problème était simplement de pouvoir dessiner hors d'une cellule lors de son appel a DrawCell ...

Pour le StretchDraw, le truc est de créer un bitmap de un pixel de large, et de 50 pixels (par exemple) de haut. Comme ça, a part si la ligne dépasse 50 pixels (et encore), le dégradé sera toujours beau.

Ensuite, pour ton histoire d'offset, je l'ai rencontré aussi, mais je ne sais absolument pas a quelle constante cela est du (je ne sais même pas si elle existe, et j'avoue que je ne me suis jamais posé la question)
Par contre, le aRect.Right:= aRect.Right -3; ne me semble pas nécessaire. Le résultat est que ton texte n'est plus parfaitement centré ...

Dernier petit truc, je pense que tu peux économiser un appel a CellRect en utilisant directement aRect...

Bonne chance !

Au fait, tu peux me tutoyer ;)
02/08/2012, 15h29
Invité

OK mick065 pour le tutoiement et réciproquement.
Chez moi, c'est une simple formule politesse. Complètement désuète sur un forum ? Je sais, c'est un peu vieillot. Mais quand j'écris -même électroniquement- à quelqu'un(e) que je ne connais pas, j'utilise les conventions usuelles. Je ne tutoie pas un(e) inconnu(e) dans la rue... et pourquoi en serait-il autrement sur un forum ? A contrario, il est vrai, je tutoie dès la première rencontre un(e) motard(e), encore plus facilement s'il (elle) possède une Harley :P. Mais là, c'est la famille ! Je ne considère pas un forum comme tel.

Bon, pour en revenir à cet "offset", c'est embêtant car la valeur est différente sous Win32 et gtk2...

Pour le right -3, sans, j'obtiens ceci :
http://www.selzig.com/1208010005/SG4.png
S'il n'existe pas (le right -3), dans la limite où le bord gauche a été déplacé de 3 pixels, si on ne corrige pas le bord droit, le centrage ne correspond plus puisque les 2 canvas (l'ancien et le décalé) n'ont plus le même centre. Je ne sais pas si c'est comme cela sur Delphi, mais tout cela c'est du bricolage... Je veux bien que le canvas serve à plein de choses ailleurs que dans les cellules des TStringgrids et que tout bon Pascalien m'expliquera que c'est tout à fait normal. Mais à l'arrivée, je considère que c'est du bidouillage. Je lisais à ce propos cette petite subtilité alors que je me demandais si de passer par le TextOut en s'appuyant sur le TextStyle du Canvas des cellules serait plus simple : TCanvas.TextStyle default TextStyle of TextRect and not TextOut... Bien sûr... Bref, il semble qu'à partir du moment on rentre dans les Columns.Style, le TextOut devient très délicat encore plus que le DrawText parce qu'il faut gérer en plus (des abscisses) les ordonnées... Bref, comme je le disais à Shaï sur un autre forum, les objets et donc la POO qui par nature les utilise, ont des défauts. Ici à mon avis, ce bel objet qu'est le canvas, à force d'être utilisé partout, nécessite des concessions inéluctablement et des pirouettes... Je crois que pour les Tstringgrids, il aurait fallu inventer un système d'affichage spécifique et plus performant. Il est intéressant de regarder le nombre de balayages complets des cellules effectués pour un Refresh. On pourrait penser un seul... Non, non... Quant à l'invalidate... que dire... compliqué !

Sur ce, je vais aller m'amuser avec les tDbf.

Encore merci pour ton aide. Je considère le problème résolu. Cordialement. Gilles

Citation:

Envoyé par selzig

Pour le right -3, sans j'obtiens ceci :
http://www.selzig.com/1208010005/SG4.png
s'il n'existe pas (le right -3), dans la limite ou le bord gauche a été déplacé de 3 pixels, si on ne corrige pas le bord droit, le centrage ne correspond plus puisque les 2 canvas (l'ancien et le décalé) n'ont plus le même centre.

Je ne vois pas dans ton code ou est ce que tu as modifié le bord gauche seulement ... Tu as utilisé un InflateRect(aRect, -3, 0);, mais ceci affecte les deux cotés a la fois, et donc ne modifie pas la position du centre de ton dessin.
Sut ton imprim écran, j'ai plutôt l'impression que ce sont les lignes blanches qui sont mal centrées, donc l'autre partie de ton code ...

En fait, ceci devrait marcher :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 Procedure Form1.StringGrid1OnDrawCell(...) begin Canvas.Brush.Style := bsClear; if (aCol >0 ) and (aRow >= FixedRows) and (arow = aRowSurvol) then Canvas.StretchDraw(aRect, Form1.Image2.Picture.Bitmap); InflateRect(aRect, -3, 0); if Columns[aCol-1].Alignment <> taCenter then DrawText(Canvas.Handle, PChar(sTmp), Length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_LEFT or DT_END_ELLIPSIS) else DrawText(Canvas.Handle, PChar(sTmp), Length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_CENTER or DT_END_ELLIPSIS) end;
Un truc, évite le Form1.Image2....

Ecoute, je ne sais pas...
Les lignes blanches sont traitées nativement par la StringGrid. Pour une fois que la touche F1 de Lazarus mène à quelque chose, j'ai bien lu en effet "InflateRect inflates the rectangle horizontally with dx pixels on each side".
Mais j'ai bien dû constater que l'affichage était décalé. J'ai pensé au départ qu'il y avait un mécanisme dans la StringGrid qui empêcherait le canvas de déborder sur l'autre cellule ? Mais dans mon cas, je n'inflate pas, je le "déflate".

Le seul code complémentaire est
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 ColCount := 1; Columns.add; Columns.add; Columns.add; Columns.add; Columns[1].Alignment := taCenter; RowCount := 10; ColWidths[0] := 16; ColWidths[1] := 380; RowHeights[3] := 40; for i := FixedRows to RowCount -1 do begin Cells[1,i] := IntToStr(i); Cells[2,i] := intToStr(i); end;
Dans la dernière image, j'ai commenté
// aRect.Right:= aRect.Right -3; {Nécessaire pour centrage et align. droite}
Le résultat, tu l'as sous les yeux : le "2" n'est plus aligné dans la colonne centrée.

02/08/2012, 16h17
mick605

Aaahh ! OK ....

Je n'avais pas compris que c'était géré nativement par Lazarus. Pour ma part, ce n'est pas le cas sous Delphi ...

Dans ce cas, tu as le choix entre laisser par défaut, mais décalé, ou gérer toi même le dessin des lignes blanches, comme mon code fait.

Bref, résolu
02/08/2012, 16h23
Invité

Oui, mais cependant, ta remarque reste d'actualité. Si on s'en tient à la simple définition de la fonction, la correction ne devrait pas être nécessaire. Et là encore c'est un problème : soit j'utilise mal la fonction [il faut trouver la doc qui permet de comprendre le comportement], soit il s'agit d'un bug et attention à sa correction... parce que ce jour là, tout ce qui sera recompilé présentera un défaut d'affichage.
02/08/2012, 16h32
mick605

Citation:

Envoyé par selzig

soit j'utilise mal la fonction [il faut trouver la doc qui permet de comprendre le comportement], soit il s'agit d'un bug et attention à sa correction... parce que ce jour là, tout ce qui sera recompilé présentera un défaut d'affichage.

Il s'agit très surement d'un bug. Si tu utilise ma fonction, quand le bug sera résolu, ton affichage ne changera pas. Par contre, avec ta fonction, tu auras un désalignement quand le bug sera corrigé ...
02/08/2012, 17h33
tourlourou

Citation:

Il existe un décalage horizontal entre l'affichage par défaut et le Drawtext... Savez-vous à quelle variable implantée dans le code de Lazarus il correspond ?

Cela n'aurait-il pas à voir avec la largeur des lignes verticales ?
Le CellRect ne tiendrait-il pas compte de son existence ?
02/08/2012, 18h39
mick605

Citation:

Envoyé par tourlourou

Cela n'aurait-il pas à voir avec la largeur des lignes verticales ?
Le CellRect ne tiendrait-il pas compte de son existence ?

Non, cela ne vient pas de la. Les lignes ne font qu'un pixel de large, et le décalage est de 3 pixels. De plus, le CellRect tient compte d'une partie des largeurs des lignes, a savoir celle du bas et celle de droite, si je ne me trompe pas.

A mon avis, ce décalage du dessin par défaut est purement "esthétique", pour que quand on ait du texte dans une cellule, celui ci ne soit pas collé en haut a gauche. Le décallage lors du centrage doit être du au fait que pour le centrage, le rectangle utilisé est le rectangle de base, auquel on a appliqué le décallage esthétique... Je sais pas si je suis très clair ...

@tourlourou
Bonjour Yves, cela ne semble pas. En faisant varier la largeur des lignes verticales, le nombre de colonnes, à vu de nez le décalage est constant. Donc c'est une constante.

@mick605
"évite le Form1.Image2...." :oops: Oui c'est de la flemmingite aigüe... On va dire un gain de temps pour l'occasion. Avec Lazarus, je préfère sérier les problèmes un par un pour intégrer les solutions ensuite dans le vrai composant. Je ne préfère pas trop montrer la déclaration du TmyStringGrid dans la Form...

Le mieux à mon avis est d'afficher les blanches avec la même fonction (pour le Texte) que celle qui gère l'affichage du Texte en mode Survol... Comme cela pas d'inflate... De toute façon, c'est déjà intégré dans le composant pour gérer la hauteur des colonnes et c'est d'ailleurs ce code que j'ai "repiqué" naturellement. J'avais déjà buté sur le problème à l'époque
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 { Dessin du texte } if Columns.Count > 0 then begin aRect.Left := aRect.left + FAlignmentMargin; aRect.Right := aRect.Right - FAlignmentMargin; if Columns[aCol-1].Alignment = taLeftJustify then DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_LEFT or DT_END_ELLIPSIS) else if Columns[aCol -1].Alignment = taRightJustify then DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_RIGHT) else if Columns[aCol -1].Alignment = taCenter then DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_CENTER) else {cas normalement impossible} DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect, DT_SINGLELINE or DT_VCENTER or DT_LEFT or DT_END_ELLIPSIS); end else {Pas de Tcolumn utilisé donc alignement à gauche} Canvas.TextRect(aRect, aRect.Left+3, aRect.Top-2, sTmp);
Merci pour vos aides. Cordialement. Gilles

Citation:

Envoyé par selzig

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 { Dessin du texte }
   if Columns.Count > 0 then begin
    aRect.Left  := aRect.left + FAlignmentMargin;
    aRect.Right := aRect.Right - FAlignmentMargin;
    if Columns[aCol-1].Alignment = taLeftJustify then
     DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect,
           DT_SINGLELINE or DT_VCENTER or DT_LEFT or DT_END_ELLIPSIS)
    else if Columns[aCol -1].Alignment = taRightJustify  then
     DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect,
           DT_SINGLELINE or DT_VCENTER or DT_RIGHT)
    else if Columns[aCol -1].Alignment = taCenter  then
     DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect,
           DT_SINGLELINE or DT_VCENTER or DT_CENTER)
    else {cas normalement impossible}
     DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect,
           DT_SINGLELINE or DT_VCENTER or DT_LEFT or DT_END_ELLIPSIS);
   end else
     {Pas de Tcolumn utilisé donc alignement à gauche}
     Canvas.TextRect(aRect, aRect.Left+3, aRect.Top-2, sTmp);

Rooooh !!!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 { Dessin du texte }
   if Columns.Count > 0 then begin
    Inflate(aRect,-FAlignmentMargin,0);
    Params := DT_SINGLELINE or DT_VCENTER;
 
    Case Columns[aCol-1].Alignment of
      taRightJustify : Params := Params or DT_RIGHT;
      taCenter       : Params := Params or DT_CENTER;
      else             Params := Params or DT_LEFT or DT_END_ELLIPSIS
    end;  
 
    DrawText(Canvas.Handle, PChar(sTmp), length(sTmp), aRect, Params);
   end else
     {Pas de Tcolumn utilisé donc alignement à gauche}
     Canvas.TextRect(aRect, aRect.Left+3, aRect.Top-2, sTmp);

Mieux non ?

02/08/2012, 19h28
Invité

Certes !

C'est un vieux code mais je ne prendrai pas cette excuse car même maintenant, je n'aurais pas fait aussi bien ! Donc Wooooh !!! :ccool:

Pour l'instant, je ne prends pas le inflate :oops:. Si je ne corrige pas avec le right, ce qui signifie que j'anticipe la réparation du bug à condition qu'il soit accepté comme tel- mes SG actuelles ont un effet visuel "dérangeant". Si je laisse le right, il me faut un postit qui me rappelle de vérifier à chaque SVN si le bug a été réparé... De plus chez Lazarus, un bug réparé est potentiellement un futur bug (redondant). Le left et right ont l'air d'être des valeurs sûres :mrgreen:.

C'est ce qui m'insupporte de plus en plus chez Lazarus. Ces bugs intermittents quand ils sont réparés, sachant que certains ne le sont jamais... réparés. Je n'ai jamais rencontré cela avec Delphi. Même un vieux programme recompilé plusieurs mois voire années plus tard avec 2005 ou 2007 : RAS ! Je sais bien que Lazarus est ambitieux (mutiOS) et que cela a un prix... mais on a quand même besoin d'un minimum de stabilité.

Bonne soirée. Gilles
02/08/2012, 20h01
mick605
Citation:

Envoyé par selzig

Pour l'instant, je ne prends pas le inflate :oops:. Si je ne corrige pas avec le right, ce qui signifie que j'anticipe la réparation du bug à condition qu'il soit accepté comme tel- mes SG actuelles ont un effet visuel "dérangeant". Si je laisse le right, il me faut un postit qui me rappelle de vérifier à chaque SVN si le bug a été réparé... De plus chez Lazarus, un bug réparé est potentiellement un futur bug (redondant). Le left et right ont l'air d'être des valeurs sûres :mrgreen:.

Alors je crois que c'est la qu'il y a incompréhension.

Code:

Inflate(aRect,-FAlignmentMargin,0);

est STRICTEMENT équivalent à
Code:

1 2 aRect.Left := aRect.left + FAlignmentMargin; aRect.Right := aRect.Right - FAlignmentMargin;
Je vais reprendre mon explication. Voila comment je vois la chose :

Actuellement, le composant StringGrid sous Lazarus a un bug :
Lors du dessin par défaut, si celui ci doit être centré, il a un décalage par rapport au centre. Le bug vient donc du dessin par défaut.
Pour pallier ce problème, il suffit de redessiner toutes les cellules, et ne pas laisser le dessin par défaut. Quelque soit la méthode de dessin, de détermination du Rect ou autre ...
Quand le bug sera résolu, ton code continuera de fonctionner car tu n'utilisera pas le dessin par défaut.

Tu peux donc utiliser le dernier code que je t'ai donné à 15h56.

J'espere ne pas trop t'embêter avec mes explications ...
02/08/2012, 21h38
Invité

OK. Je n'avais effectivement pas compris...
Bonne soirée. Gilles