You are on page 1of 10

An image list is an array of pictures of the same size.

The pictures are created as a single icon or bitmap and each icon or bitmap can be located using its index. The array is zero-based, meaning that the first picture has an index of 0. The second has an index of 1, etc. An image list is not a traditional control. It does not display to the user who in fact is ne er aware of it. It is used to complement a control that needs a series of pictures for its own display. This means that, when you decide to create an image list, you must !now why you need one and what you intend to use it for. "ractical #earning$ Introducing Image #ists 1. %tart &mbarcadero 'A( %tudio ). To create a new application, on the main menu, clic! *ile -+ ,ew -+ -.# *orms Application - .//0uilder 1. In the 2b3ect Inspector, clic! .aption and type Picture Review

"reparing the "ictures of an Image #ist

The image list does not create the necessary images for the list. It only stores them for e entual retrie al. Therefore, before creating a list of images, you must first create the actual pictures that would ma!e up the list. To prepare the images, you can use any normal picture editor, including 4indows "aint that installs with the operating system. There are two categories of image lists$

A mas!ed image list is made of two pictures 5bitmaps6 of the same size. The first bitmap is made of colors. 7ere is an example$

The second is in blac! and white. 7ere is an example

A non-mas!ed image list is a colored bitmaps with one or more pictures. 7ere is an example$

0ased on the abo e description, there are two layouts to follow for an image list. 8ou can create or use one picture, in color or not. This would be used on mas!ed scenarios. The second techni9ue consists of creating a single, long picture that contains each of the needed pictures. In this case, you would add this single picture to the image list at once. The picture should 5must6 pro ide a series of pictures uniformly dimensioned. "ractical #earning$ "reparing the "ictures of an Image #ist .opy the chic!en images and paste them in a folder of your choice .reating an Image #ist In the 4in1), an image list of a handle to HIMAGELIST. To create an image list, you call the ImageList_Create() function. Its syntax is$
HIMAGELIST ImageList_Create( int cx, int cy, UINT flags, int cInitial, int cGrow );

The -.# pro ides support for image lists through a class named TImageList. The TImageList class is deri ed from TDragImageList that itself is based on the TCustomImageList class. The TCustomImageList class is deri ed from TCompo e t$

To isually start an image list, in the 4in1) section of the Tool "alette, clic! the TImage#ist button and clic! the form 5or a container6. If you are planning to use images that are larger than 1)x1) pixels, you should create the control programmatically. To dynamically create an image list, declare a pointer to TImageList. 7ere is an example$
//--------------------------------------------------------------------------class T !rm" # $%&lic T !rm ' __$%&lis(e)# // I*E-manage) C!m$!nents $ri+ate# TImageList ,lstImages; // User )eclarati!ns $%&lic# // User )eclarati!ns __-astcall T !rm"(TC!m$!nent, ./ner); 0; //---------------------------------------------------------------------------

0efore implementing it, use the ew operator on its constructor to indicate its owner. This could be done as follows$
//--------------------------------------------------------------------------__-astcall T !rm"##T !rm"(TC!m$!nent, ./ner) # T !rm(./ner) ' lstImages 1 ne/ TImageList(t(is); 0 //---------------------------------------------------------------------------

If you plan to use more than one image list, you can then declare either arious TImageList ariables or an array of TImageList ariables. An example would be$
//--------------------------------------------------------------------------class T !rm" # $%&lic T !rm

' __$%&lis(e)# // I*E-manage) C!m$!nents $ri+ate# TImageList ,lstSingleImages; TImageList ,lstM%lti$leImages; // User )eclarati!ns $%&lic# // User )eclarati!ns __-astcall T !rm"(TC!m$!nent, ./ner); 0; //--------------------------------------------------------------------------//--------------------------------------------------------------------------__-astcall T !rm"##T !rm"(TC!m$!nent, ./ner) # T !rm(./ner) ' lstSingleImages 1 ne/ TImageList(t(is); lstM%lti$leImages 1 ne/ TImageList(t(is); 0 //---------------------------------------------------------------------------

"ractical #earning$ .reating an Image #ist 1. :nder the .ode &ditor, clic! :nit1.h and, in the pri ate section, declare a ariable as follows$ TImageList !"stPictures# ). .lic! :nit1.cpp and change the constructor as follows$
23 43 53 63 73 93 //--------------------------------------------------------------------------__-astcall T !rm"##T !rm"(TC!m$!nent, ./ner) # T !rm(./ner) ' lst8ict%res 1 ne/ TImageList(t(is); 0 //---------------------------------------------------------------------------

;. "ress *1) to display the form .haracteristics of Image #ists Adding an Image to the #ist

After isually adding an image list to a form or container, to add one or more pictures, right-clic! it and cli clic! it. This would open the Image#ist &ditor. In the Image#ist &ditor, clic! the Add button, locate and se the same way, you can add as many pictures as you need. The other buttons on the dialog box allow you to whole list. The pictures are added subse9uently and each occupies a specific position. If you want to chang and drag it left or right.

If you are programmatically creating the list of images, you can add each icon or picture indi idually if the entities. 8ou can also add a single long bitmap that is made of arious pictures. To add a bitmap to an image list, call the A$$() method. Its syntax is$
int __-astcall A))(Gra$(ics##T:itma$, Image, Gra$(ics##T:itma$, Mask);

The first parameter, Image, is the bitmap you are adding to the list. "ractical #earning$ Adding Images to a #ist 1. (ouble-clic! the middle of the form to generate its 2n.reate e ent

). Implement it as follows 5change the path to the one where your pictures are located6$
23 //--------------------------------------------------------------------------43 +!i) __-astcall T !rm"## !rmCreate(T.&;ect ,Sen)er) 53 ' 63 Gra$(ics##T:itma$ , &m$8ict%re 1 NULL; 73 93 &m$8ict%re 1 ne/ Gra$(ics##T:itma$; <3 &m$8ict%re-=L!a) r!m ile(L>C#??E@ercise??c(icAen"3&m$>); "B3 lst8ict%res-=A))(&m$8ict%re, &m$8ict%re); ""3 "C3 &m$8ict%re 1 ne/ Gra$(ics##T:itma$; "23 &m$8ict%re-=L!a) r!m ile(L>C#??E@ercise??c(icAenC3&m$>); "43 lst8ict%res-=A))(&m$8ict%re, &m$8ict%re); "53 "63 &m$8ict%re 1 ne/ Gra$(ics##T:itma$; "73 &m$8ict%re-=L!a) r!m ile(L>C#??E@ercise??c(icAen23&m$>); "93 lst8ict%res-=A))(&m$8ict%re, &m$8ict%re); "<3 CB3 &m$8ict%re 1 ne/ Gra$(ics##T:itma$; C"3 &m$8ict%re-=L!a) r!m ile(L>C#??E@ercise??c(icAen43&m$>); CC3 lst8ict%res-=A))(&m$8ict%re, &m$8ict%re); C23 C43 &m$8ict%re 1 ne/ Gra$(ics##T:itma$; C53 &m$8ict%re-=L!a) r!m ile(L>C#??E@ercise??c(icAen53&m$>); C63 lst8ict%res-=A))(&m$8ict%re, &m$8ict%re); C73 C93 // A);%st t(e siDe !- t(e -!rm t! siDe !- t(e image C<3 ClientEi)t( 1 lst8ict%res-=Ei)t(; 2B3 ClientHeig(t 1 lst8ict%res-=Heig(t;

2"3 0 //---------------------------------------------------------------------------

The %ize of an Image #ist

#i!e other graphics controls, an image list has dimensions. The width of the image list is the width of each that all pictures must ha e the same width. The width is set or controlled by the %i$t& property. This wou
//--------------------------------------------------------------------------__-astcall T !rm"##T !rm"(TC!m$!nent, ./ner) # T !rm(./ner) ' lstSingleImages 1 ne/ TImageList(t(is); lstM%lti$leImages 1 ne/ TImageList(t(is); Gra$(ics##T:itma$ ,m%lti$le:itma$sF4G; m%lti$le:itma$sFBG 1 ne/ Gra$(ics##T:itma$; lstM%lti$leImages-=Ei)t( 1 m%lti$le:itma$sFBG-=Ei)t(; m%lti$le:itma$sF"G 1 ne/ Gra$(ics##T:itma$; lstM%lti$leImages-=Ei)t( 1 m%lti$le:itma$sF"G-=Ei)t(;

0 //---------------------------------------------------------------------------

The height of an image list is the normal height of each of its pictures. It is set or controlled by the 7eight p "ractical #earning$ %pecifying the %ize of an Image

1. In the constructor, specify the size of the images of the list as follows$
C3 23 43 53 63 73 93 <3 //--------------------------------------------------------------------------__-astcall T !rm"##T !rm"(TC!m$!nent, ./ner) # T !rm(./ner) ' lst8ict%res 1 ne/ TImageList(t(is); lst8ict%res-=Ei)t( 1 5BB; lst8ict%res-=Heig(t 1 275; 0 //---------------------------------------------------------------------------

10. "ress *1) to display the form <as!ing an Image #ist

As stated already, there are two categories of bitmaps or icons that can be used on an image list$ mas!ed or list mas!ed, set the Mas'e$ property to true.

If you are programmatically adding the pictures to the image list using the A$$() method, if the bitmap is m as the mas! for the second argument. If you had set the Mas'e$ property to false, the Mask argument wou you can pass it as ,:##. If the image list is made of a single bitmap, you can simply add it normally. If the list will be created from sure you add each. 7ere is an example$
//--------------------------------------------------------------------------__-astcall T !rm"##T !rm"(TC!m$!nent, ./ner) # T !rm(./ner)

'

lstM%lti$leImages 1 ne/ TImageList(t(is); lstM%lti$leImages-=MasAe) 1 alse; Gra$(ics##T:itma$ ,m%lti$leImagesF4G; m%lti$leImagesFBG 1 ne/ Gra$(ics##T:itma$; m%lti$leImagesFBG-=L!a) r!m ile(>8ict%re"3&m$>); lstM%lti$leImages-=Ei)t( 1 m%lti$leImagesFBG-=Ei)t(; lstM%lti$leImages-=Heig(t 1 m%lti$leImagesFBG-=Heig(t; lstM%lti$leImages-=A))(m%lti$leImagesFBG, NULL);

3 3 3 0 //---------------------------------------------------------------------------

If you had set the Mas'e$ property to true but the bitmap is not doubled, instead of using a color as the ma method. Its syntax is$
int __-astcall A))MasAe)(Gra$(ics##T:itma$, Image, Gra$(ics##TC!l!r MaskColor);

The Image parameter is the bitmap to add to the list. 2nce again, the second argument will depend on whet If it is, you can pass a MaskColor color to be used to mas! the bitmap. The Image Type

After specifying that the image list will use the Mas'e$ attribute, use the ImageT(pe property to indicate will use two sets of colors. The possible alues of this property deri e from the TImageT(pe enumerator w )a"ue it<as! The 0ac! .olor of the Images Descriptio The picture uses a mas!

itImage The picture is single

After specifying that the picture of an image list is mas!ed, when drawing a picture from an image list, you ser e as its bac!ground. This is set or retrie ed using the *'Co"or property. If the Mas'e$ property is set be used to replace the mas!ed sections of the picture. =etting an Image *rom the #ist To retrie e the bitmap stored at a specific position in the list, call the Get*itmap() method. Its syntax is$
+!i) __-astcall Get:itma$(int Index, Gra$(ics##T:itma$, Image);

0efore calling this method, you should declare a pointer to T*itmap and pass it as the second argument. T index of the bitmap in the list. If the bitmap exists, it is returned as the Image parameter. To add an icon to an image list, call the A$$Ico () method. Its syntax is$
int __-astcall A))Ic!n(Gra$(ics##TIc!n, Image);

The Image parameter is the icon that needs to be added.

&ach of these methods 5A$$() and A$$Ico ()6 returns the index of the bitmap or icon that was added if the returns >1 indicating that the icon or bitmap was not added. The ,umber of Images

2nce the bitmaps or icons ha e been added, if you want to find out how many images are in the list, get the "ractical #earning$ :isng the Images of the #ist 1. In the top section of the 2b3ect Inspector, clic! & ents and double-clic! 2n.lic! ). Implement the e ent as follows$
23 //--------------------------------------------------------------------------43 +!i) __-astcall T !rm"## !rmClicA(T.&;ect ,Sen)er) 53 ' 63 static int C%rrent8!siti!n 1 B; 73 93 i-( C%rrent8!siti!n 11 lst8ict%res-=C!%nt ) <3 C%rrent8!siti!n 1 B; "B3 else ""3 ' "C3 Gra$(ics##T:itma$ , &m$C%rrent 1 ne/ Gra$(ics##T:itma$; "23 "43 lst8ict%res-=Get:itma$(C%rrent8!siti!nHH, &m$C%rrent); "53 Can+as-=*ra/(B, B, &m$C%rrent); "63 0 "73 0 //---------------------------------------------------------------------------

1?. "ress *; to execute the application 1;. .lic! the middle of the form

You might also like