Images dans un TListView

BlouMan Messages postés 93 Date d'inscription mardi 15 mars 2005 Statut Membre Dernière intervention 2 juillet 2007 - 24 mars 2005 à 14:38
WhiteHippo Messages postés 1154 Date d'inscription samedi 14 août 2004 Statut Membre Dernière intervention 5 avril 2012 - 11 avril 2005 à 19:03
bonjour les gens,

je voudrais savoir s'il est possible (et a quel cas comment on fait) d'insérer des images sur lesquelles on peut ensuite cliquer à l'intérieur d'une TListView?

pour vous donner une idée ça devrait (au niveau du rendu) s'approcher de la colonne "classement" dans la bibliothèque multimédia de Windows Média Player. Y'a des petites étoiles et quand la souris survole la case 5 petites étoiles "vides" s'affichent on clique alors sur l'une d'elle pour dire si le morceau est classé parmi les bons ou les mauvais et si on a cliqué sur la 3ème quand on retire la souris de la case il y a 3 étoiles "pleines" et les autres ne sont plus visibles.

merci beaucoup d'avance pour votre quantité incroyable de réponses.... ;)


<HR>
BLOU BLOU POWAA

5 réponses

WhiteHippo Messages postés 1154 Date d'inscription samedi 14 août 2004 Statut Membre Dernière intervention 5 avril 2012 3
24 mars 2005 à 20:50
N.B. ce qui suit à été fait en 2 coups de cuillères à pot, et ce n'est qu'un exemple purement didacticiel fait rapidement. Bref ce n'est qu'une trame à améliorer et compléter.

Ceci étant dit, voilà comment j'ai procédé :

D'abord 3 étoiles : (Je sais c'est une capture de celles du lecteur windows media player :oP, mais j'ai précisé au dessus que j'ai fait ça rapido... pas le temps de faire les miennes)
Tu ajoutes 3 Tbitmap à ta fiche pour chacune de ces etoiles, avec la propriété transparent=true.
puis une listview, avec 4 colonnes, et 3 éléments (Juste pour tester)

La méthode consiste à utiliser les evenement OnCustomDraw de la listview.

Voici la fiche :

object Form1: TForm1
Left = 200
Top = 107
Width = 452
Height = 384
Caption = 'WhiteHippo OnCustomDraw ListView Demo'
Color = clBtnFace
Font.Charset = DEFAULT_CHARSET
Font.Color = clWindowText
Font.Height = -11
Font.Name = 'MS Sans Serif'
Font.Style = []
OldCreateOrder = False
PixelsPerInch = 96
TextHeight = 13
object Image1: TImage
Left = 401
Top = 4
Width = 12
Height = 13
AutoSize = True
Picture.Data = {
07544269746D61700A020000424D0A0200000000000036000000280000000C00
00000D0000000100180000000000D40100000000000000000000000000000000
0000F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0
F3EAE0F3EAE0F3EAE0E1E1E0CCB29DCCC7C1F3EAE0F3EAE0F3EAE0F3EAE0CCC7
C1CCB29DE1E1E0F3EAE0F3EAE0E8E5E2D6AA89F9E2D1C8AC96F3EAE0F3EAE0C8
AC96F9E2D1D6AA89E8E5E2F3EAE0F3EAE0F3EAE0CCAB92F7E0CEEED4BFCAA386
CAA386EED4BFF7E0CECCAB92F3EAE0F3EAE0F3EAE0F3EAE0D2D5D4D3AA8CECCF
BAEDD3BEEDD3BEECCFBAD3AA8CD2D5D4F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0CA
9C7AF1D7C4E6C8B2E6C8B2F1D7C4CA9C7AF3EAE0F3EAE0F3EAE0F3EAE0CFD3D4
C0926FD2AC8EFBE5D5F4DCC9F4DCC9FBE5D5D2AC8EC0926FCFD3D4F3EAE0B9A6
95CA9A78FEEFE6FEF3ECFEF8F6FEF8F6FEF8F6FEF8F6FEF3ECFEEFE6CA9A78B9
A695D4A98AEBD5C9D5AC8ED4AA8CD6B196FEF4EEFEF4EED6B196D4AA8CD5AC8E
EBD5C9D4A98AF3EAE0F3EAE0F3EAE0F3EAE0D7B092FEF4EEFEF4EED7B092F3EA
E0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0C5BFB5F9EEE7F9EEE7C5
BFB5F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0DEDFDFECD0BC
ECD0BCDEDFDFF3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EA
E0E6C1A5E6C1A5F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0}
Transparent = True
end
object Image2: TImage
Left = 413
Top = 4
Width = 12
Height = 13
AutoSize = True
Picture.Data = {
07544269746D61700A020000424D0A0200000000000036000000280000000C00
00000D0000000100180000000000D40100000000000000000000000000000000
0000F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0
F3EAE0F3EAE0F3EAE0F1E8E3CCC2BBE3DAD4F3EAE0F3EAE0F3EAE0F3EAE0E3DA
D4CCC2BBF1E8E3F3EAE0F3EAE0EFE7E2D1C7C1E4DBD6D8CFC9F3EAE0F3EAE0D8
CFC9E4DBD6D1C7C1EFE7E2F3EAE0F3EAE0F3EAE0C3B9B2F3EAE0ECE4DFD3C9C3
D3C9C3ECE4DFF3EAE0C3B9B2F3EAE0F3EAE0F3EAE0F3EAE0DFD5D0DCD3CDF3EA
E0F3EAE0F3EAE0F3EAE0DCD3CDDFD5D0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0CF
C5BEF3EAE0F3EAE0F3EAE0F3EAE0CFC5BEF3EAE0F3EAE0F3EAE0F3EAE0EAE1DC
C9BFB8ECE4DFF3EAE0F3EAE0F3EAE0F3EAE0ECE4DFC9BFB8EAE1DCF3EAE0C4BA
B3DDD4CEF3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0DDD4CEC4
BAB3D1C7C1D1C7C1D1C7C1D1C7C1ECE4DFF3EAE0F3EAE0ECE4DFD1C7C1D1C7C1
D1C7C1D1C7C1F3EAE0F3EAE0F3EAE0F3EAE0CDC3BDF3EAE0F3EAE0CDC3BDF3EA
E0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0D0C6C0F3EAE0F3EAE0D0
C6C0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0EEE6E1D8CEC8
D8CEC8EEE6E1F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EA
E0D0C6C0D0C6C0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0}
Transparent = True
end
object Image3: TImage
Left = 425
Top = 4
Width = 12
Height = 14
AutoSize = True
Picture.Data = {
07544269746D61702E020000424D2E0200000000000036000000280000000C00
00000E0000000100180000000000F80100000000000000000000000000000000
0000F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0
F3EAE0F3EAE0F3EAE0E1E2E257A8D690C2DCF3EAE0F3EAE0F3EAE0F3EAE090C2
DC57A8D6E1E2E2F3EAE0F3EAE0E8E5E32EA1DC2EDFF055A5D5F3EAE0F3EAE055
A5D52EDFF02EA1DCE8E5E3F3EAE0F3EAE0F3EAE050A8D82ED4F82EC1ED479FD5
479FD52EC1ED2ED4F850A8D8F3EAE0F3EAE0F3EAE0F3EAE0C5D8E12EADDF2EC5
F82ECEF42ECEF42EC5F82EADDFC5D8E1F3EAE0F3EAE0F3EAE0F3EAE0F3EAE033
A7DB2EE4F92ECBF92ECBF92EE4F933A7DBF3EAE0F3EAE0F3EAE0F3EAE0C9D7DF
41A1D62EB4DB2EF9F92EEAFA2EEAFA2EF9F92EB4DB41A1D6C9D7DFF3EAE066B1
D92EA1DCC1F8F8C9FBFAFDFBFAFDFBFAFDFBFAFDFBFAC9FBFAC1F8F82EA1DC66
B1D932A6DF92D9F032ABDF32A7DF2EB4DF2EFBFA2EFBFA2EB4DF32A7DF32ABDF
92D9F032A6DFF3EAE0F3EAE0F3EAE0F3EAE047A6D82EFBFA2EFBFA47A6D8F3EA
E0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE07DBBDAB4EBF6B4EBF67D
BBDAF3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0DDE1E251C1E7
51C1E7DDE1E2F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EA
E02EADDF2EADDFF3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3
EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0F3EAE0}
Transparent = True
end
object ListView1: TListView
Left = 0
Top = 0
Width = 399
Height = 350
Align = alLeft
Columns = <
item
end
item
end
item
MaxWidth = 66
MinWidth = 66
Width = 66
end
item
end>
HotTrack = True
HoverTime = 1
Items.Data = {
770000000300000000000000FFFFFFFFFFFFFFFF030000000000000002413102
4231013502443100000000FFFFFFFFFFFFFFFF03000000000000000241320242
32013202443200000000FFFFFFFFFFFFFFFF0300000000000000024133024233
0130024433FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF}
RowSelect = True
ParentShowHint = False
ShowHint = True
TabOrder = 0
ViewStyle = vsReport
OnCustomDraw = ListView1CustomDraw
OnCustomDrawItem = ListView1CustomDrawItem
OnCustomDrawSubItem = ListView1CustomDrawSubItem
end
end

Ensuite le code de la fiche :

unit Demo;


interface


uses
Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,
ComCtrls, ExtCtrls, StdCtrls;


type
TForm1 = class(TForm)
Image1: TImage;
Image2: TImage;
Image3: TImage;
ListView1: TListView;

procedure ListView1CustomDraw(Sender: TCustomListView;
const ARect: TRect; var DefaultDraw: Boolean);
procedure ListView1CustomDrawItem(Sender: TCustomListView;
Item: TListItem; State: TCustomDrawState; var DefaultDraw: Boolean);
procedure ListView1CustomDrawSubItem(Sender: TCustomListView;
Item: TListItem; SubItem: Integer; State: TCustomDrawState;
var DefaultDraw: Boolean);
end;


var
Form1: TForm1;


implementation


uses
CommCtrl;


{$R *.DFM}


procedure TForm1.ListView1CustomDraw(Sender: TCustomListView;
const ARect: TRect; var DefaultDraw: Boolean);
begin
Sender.Canvas.Brush.Color := clWhite ;
Sender.Canvas.fillrect(ARect);
end;


procedure TForm1.ListView1CustomDrawItem(Sender: TCustomListView;
Item: TListItem; State: TCustomDrawState; var DefaultDraw: Boolean);
begin
DefaultDraw := True;
if not odd(item.Index) then
sender.Canvas.Brush.Color := $00CECEFF
else
Sender.Canvas.Brush.Color := clwhite;
end;


procedure TForm1.ListView1CustomDrawSubItem(
Sender: TCustomListView; Item: TListItem; SubItem: Integer;
State: TCustomDrawState; var DefaultDraw: Boolean);
var
T,L : integer ;
UnRect : TRect ;


procedure DessinerClassement ( const T,L,Valeur : Integer; const survole : boolean ) ;
var
R : TRect ;
const
LARGEUR_ETOILE = 13 ;


procedure DessinerEtoile ( const x,y : integer ; const s, v : boolean );
begin
if ( s and v ) then Sender.Canvas.Draw(x,y,Image3.Picture.Graphic) // survole
else if ( v ) then Sender.Canvas.Draw(x,y,Image1.Picture.Graphic) // valide
else Sender.Canvas.Draw(x,y,Image2.Picture.Graphic); // vide
end ;


procedure DessinerVide ( const x,y : integer ; const b : boolean );
begin
Sender.Canvas.Draw(L+LARGEUR_ETOILE*0,T,Image3.Picture.Graphic)
end ;


begin
R := Rect(L,T,L+LARGEUR_ETOILE*5+1,T+LARGEUR_ETOILE+1);
Sender.Canvas.FillRect(R);
DessinerEtoile (L+LARGEUR_ETOILE*0,T,Survole,( Valeur >=1 ) );
DessinerEtoile (L+LARGEUR_ETOILE*1,T,Survole,( Valeur >=2 ) );
DessinerEtoile (L+LARGEUR_ETOILE*2,T,Survole,( Valeur >=3 ) );
DessinerEtoile (L+LARGEUR_ETOILE*3,T,Survole,( Valeur >=4 ) );
DessinerEtoile (L+LARGEUR_ETOILE*4,T,Survole,( Valeur >=5 ) );
end ;


begin
DefaultDraw := True;
if not odd(item.Index) then
sender.Canvas.Brush.Color := $00CEFFFF
else
Sender.Canvas.Brush.Color := clwhite;
ListView_GetItemRect( Sender.Handle,Item.Index,UnRect, 0);


if ( SubItem=2) then // 2 = Colonne du classement où l'on affiche les étoiles
begin
DefaultDraw := false ;
T := UnRect.Top ;
L := ListView_GetColumnWidth( Sender.Handle, 0 )
+ ListView_GetColumnWidth( Sender.Handle, 1 ) ;
DessinerClassement( T, L, Item.Index, cdsFocused in State ) ;
end ;


end;

Voilà j'espere que cela répond à tes attentes.

Cordialement.
0
WhiteHippo Messages postés 1154 Date d'inscription samedi 14 août 2004 Statut Membre Dernière intervention 5 avril 2012 3
28 mars 2005 à 00:27
Bon, mon code a pas l'air de t'inspirer beaucoup Blouman :oP


Cordialement.
0
BlouMan Messages postés 93 Date d'inscription mardi 15 mars 2005 Statut Membre Dernière intervention 2 juillet 2007
11 avril 2005 à 13:36
si si mais je suis en train de le tester... je validerais quand je saurais si ça marche bien... ;)


<HR>
BLOU BLOU POWAA
0
BlouMan Messages postés 93 Date d'inscription mardi 15 mars 2005 Statut Membre Dernière intervention 2 juillet 2007
11 avril 2005 à 14:28
y'a un probleme... c'est quoi ça :

ListView_GetItemRect( Sender.Handle,Item.Index,UnRect, 0);
ListView_GetColumnWidth( Sender.Handle, 0 );

c'est toi qui l'a implémenté?


<HR>
BLOU BLOU POWAA
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
WhiteHippo Messages postés 1154 Date d'inscription samedi 14 août 2004 Statut Membre Dernière intervention 5 avril 2012 3
11 avril 2005 à 19:03
Y'a pas de problème si tu incorpore l'unité CommCtrl (voir la clause uses sous la section implementation). C'est dans cette unité qu'elles sont définies.

Cordialement.
0
Rejoignez-nous