?? ch17.htm
字號:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"><HTML><HEAD> <META NAME="GENERATOR" Content="Symantec Visual Page Mac 1.1"> <TITLE>Teach Yourself Visual C++® 5 in 24 Hours -- Hour 17 -- Using Image Lists and Bitmaps</TITLE></HEAD><BODY TEXT="#000000" BGCOLOR="#FFFFFF"><H1 ALIGN="CENTER"><IMG SRC="../button/sams.gif" WIDTH="171" HEIGHT="66" ALIGN="BOTTOM"BORDER="0"><BR><FONT COLOR="#000077">Teach Yourself Visual C++® 5 in 24 Hours</FONT></H1><CENTER><P><A HREF="../ch16/ch16.htm"><IMG SRC="../button/previous.gif" WIDTH="128" HEIGHT="28"ALIGN="BOTTOM" ALT="Previous chapter" BORDER="0"></A><A HREF="../ch18/ch18.htm"><IMGSRC="../button/next.gif" WIDTH="128" HEIGHT="28" ALIGN="BOTTOM" ALT="Next chapter"BORDER="0"></A><A HREF="../index.htm"><IMG SRC="../button/contents.gif" WIDTH="128"HEIGHT="28" ALIGN="BOTTOM" ALT="Contents" BORDER="0"></A> <HR></CENTER><H1 ALIGN="CENTER"><FONT COLOR="#000077">- Hour 17 -<BR>Using Image Lists and Bitmaps</FONT></H1><P>Image lists can be used to store collections of bitmaps, making them useful whenseveral bitmaps are needed, such as in tree view and list view controls. In thishour, you learn<UL> <LI>How to create an image list<BR> <BR> <LI>The properties and methods that can be applied to an image list<BR> <BR> <LI>How to use an image list as a bitmap container<BR> <BR> <LI>The advanced drawing features offered by image lists</UL><P>Also, in this hour you will build a sample program that creates an image listand uses it as a storage location for bitmap images. This hour will build a foundationthat you will use later in Hour 18, "List View Controls," and Hour 19,"Tree Views."<H2><FONT COLOR="#000077"><B>What Is an Image List?</B></FONT></H2><P>An image list is similar to an array of bitmaps, just like a roll of film is anarray of images, as shown in Figure 17.1. Unlike rolls of film, an image list cangrow, if needed, as extra images are added to the list. Each bitmap stored in animage list is associated with an index, which can be used to retrieve a particularimage.</P><P><A NAME="01"></A><A HREF="01.htm"><B>Figure 17.1.</B></A> <BR><I>An image list is like a roll of bitmap images.</I><BLOCKQUOTE> <P><HR><FONT COLOR="#000077"><B>Time Saver:</B></FONT><B> </B>Image lists can also be used outside these new controls, and they provide an easy way to store a series of bitmaps, because you must handle only a single image-list object instead of separate objects for each bitmap. <HR></BLOCKQUOTE><P>If you want to display bitmaps in tree views or list views, you must use an imagelist. If your program needs to manage several different bitmapped images, a singleimage list is easier to use than a series of bitmaps. Accessing and displaying multipleimages from an image list is much easier than handling multiple <TT>CBitmap</TT>objects. Windows Explorer has a much richer user interface than the older File Managerused in Windows 3.1. Much of this richness is achieved through the use of image lists,which offer an easy way to store and manage bitmaps.</P><P>In addition, image lists offer two features that are difficult to duplicate withregular bitmaps:<UL> <LI>Transparent images <LI>Overlaid images</UL><P><FONT COLOR="#000077"><B>New Term:</B></FONT><B> </B>A <I>transparent image</I>is an image that allows the background to be seen through part of the image, as ifpart of the bitmap were transparent.</P><P>A transparent image is difficult to achieve using a normal bitmap. In the simplestcases, about twice as many lines of code are required to draw a bitmap transparentlyas are required to draw it as an opaque image against a drawing surface. Using animage list, drawing a transparent bitmap is almost effortless, requiring little morethan parameters that are set correctly.</P><P><FONT COLOR="#000077"><B>New Term:</B></FONT><B> </B>An <I>overlaid image </I>iscreated by combining two images to form a single, combined image.</P><P>An overlaid image is useful when showing special attributes for items representedby images stored in an image list. For example, when a shared directory is shownin the Explorer, a server "hand" is superimposed over the directory's folder.This is an overlaid image.<H2><FONT COLOR="#000077"><B>How Is an Image List Used?</B></FONT></H2><P>As for almost everything else in Windows, there is an MFC class for image lists,too. The <TT>CImageList</TT> class is used to create, display, and otherwise manageimage lists in an MFC-based Windows program.</P><P>Image lists often are used to provide item images for the <TT>CListCtrl</TT> classthat is covered in Hour 18, and the <TT>CTreeCtrl</TT> class that is covered in Hour19. However, you can also use an image list as a collection of bitmaps, which youwill do in this chapter. Using image lists in this way helps show off the differentthings you can do with image lists before they are used with the common controls.</P><P>As an example of using image lists, create an SDI project named ImageList. Thisproject uses an image list to display a series of bitmaps in the program's clientarea.<H3><FONT COLOR="#000077"><B>Creating an Image List</B></FONT></H3><P>The first step in creating an image list is to create a series of bitmaps, eachof which is the same size. Although the images can be any size, the sample code inthis section assumes the bitmaps are 32 pixels on each side. The bitmaps used inthe example are shown in Figure 17.2.</P><P><A NAME="02"></A><A HREF="02.htm"><B>Figure 17.2.</B></A> <I><BR>The bitmaps used in the ImageList example are all the same size.</I></P><P>Create the three bitmaps, and name them as shown in Table 17.1.<H4><FONT COLOR="#000077">Table 17.1. Bitmaps used in the ImageList project.</FONT></H4><P><TABLE BORDER="1"> <TR ALIGN="LEFT" rowspan="1"> <TD ALIGN="LEFT" VALIGN="TOP"><B>ID</B></TD> <TD ALIGN="LEFT" VALIGN="TOP"><B>Description</B></TD> </TR> <TR ALIGN="LEFT" rowspan="1"> <TD ALIGN="LEFT" VALIGN="TOP"><TT>IDB_CROSS</TT></TD> <TD ALIGN="LEFT" VALIGN="TOP">Cross mark</TD> </TR> <TR ALIGN="LEFT" rowspan="1"> <TD ALIGN="LEFT" VALIGN="TOP"><TT>IDB_CHECK</TT></TD> <TD ALIGN="LEFT" VALIGN="TOP">Check mark</TD> </TR> <TR ALIGN="LEFT" rowspan="1"> <TD ALIGN="LEFT" VALIGN="TOP"><TT>IDB_BANG</TT></TD> <TD ALIGN="LEFT" VALIGN="TOP">Exclamation point</TD> </TR></TABLE></P><P>Storing a bitmap image in an image list consists of three steps:<DL> <DD>1. Load the bitmap.<BR> <BR> 2. Create a new image index in the image list that contains a copy of the bitmap.<BR> <BR> 3. Delete the bitmap object.</DL><P>The bitmap object is deleted because the image list makes a copy of the bitmapand stores the image internally. As a rule of thumb, any time a Windows GDI objectis loaded, it should be deleted to prevent memory leaks. The preceding steps arehandled by <TT>AddBitmapToImageList</TT>, a new function added to the <TT>CImageListView</TT>class. Add the function provided in Listing 17.1 to the <TT>ImageListView.cpp</TT>source file.<H4><FONT COLOR="#000077">TYPE: Listing 17.1. The CImageListView::AddBitmapToImageListfunction.</FONT></H4><PRE><FONT COLOR="#0066FF"><TT>BOOL CImageListView::AddBitmapToImageList( UINT nResourceID )</TT><TT>{</TT><TT> BOOL bReturn;</TT><TT> CBitmap bmp;</TT><TT> bReturn = bmp.LoadBitmap( nResourceID );</TT><TT> if( bReturn != FALSE )</TT><TT> {</TT><TT> int nReturn = m_imageList.Add( &bmp, RGB(255,255,255) );</TT><TT> bmp.DeleteObject();</TT><TT> }</TT><TT> return bReturn;</TT></FONT></PRE><P><TT>}</TT> The <TT>AddBitmapToImageList</TT> function is used because three bitmapresources are added to the image list. Adding the bitmaps using a new member functionreduces the amount of code you must write and helps reduce the chance of errors,because every bitmap is loaded using the same function.</P><P>The <TT>CImageList::Add</TT> member function is used to add an image to the imagelist. The version of <TT>Add</TT> used in Listing 17.1 takes two parameters:<UL> <LI>The address of the <TT>CBitmap</TT> image to be copied into the image list<BR> <BR> <LI>A <TT>COLORREF</TT> value that represents the background color of the bitmap</UL><BLOCKQUOTE> <P><HR><FONT COLOR="#000077"><B>Time Saver:</B></FONT><B> </B>The background color is used when drawing transparent images using masked bitmaps. If you aren't using a masked image list, the <TT>COLORREF</TT> value is ignored. <HR></BLOCKQUOTE><P>After adding the member function to the <TT>ImageListView.cpp</TT> file, add thesource code from Listing 17.2 to the <TT>CImageListView</TT> class, found in thefile <TT>ImageListView.h</TT>. Add the source code in the class implementation section,which is marked by the <TT>// Implementation</TT> comment. After the comment, thereis a <TT>protected:</TT> label inserted by AppWizard for user- supplied variablesand functions.<H4><FONT COLOR="#000077">TYPE: Listing 17.2. Source code to be added to the CImageListViewclass.</FONT></H4><PRE><FONT COLOR="#0066FF"><TT>protected:</TT><TT> BOOL AddBitmapToImageList( UINT nResourceID );</TT></FONT></PRE><P><TT>CImageList m_imageList;</TT> The actual work of creating the image list isdone when the view is constructed. The image list can be built at any time; however,it is costly to create an image list in terms of computing power. Creating the imagelist in the constructor lets you build it once, rather than each time it is used.Add the source code from Listing 17.3 to the constructor for <TT>CImageViewList</TT>.<H4><FONT COLOR="#000077">TYPE: Listing 17.3. The CImageListView constructor.</FONT></H4><PRE><FONT COLOR="#0066FF"><TT>CImageListView::CImageListView()</TT><TT>{</TT><TT> m_imageList.Create( 32, 32, TRUE, 3, 1 );</TT><TT> AddBitmapToImageList( IDB_CROSS );</TT><TT> AddBitmapToImageList( IDB_CHECK );</TT><TT> AddBitmapToImageList( IDB_BANG );</TT></FONT></PRE><P><TT>}</TT> The image list is created using one of the <TT>CImageList::Create</TT>functions. This version of <TT>Create</TT> is useful when an image list is used asa bitmap collection; I use other versions of <TT>Create</TT> in the following chapters.This version of <TT>Create</TT> has five parameters:<UL> <LI>The height of each bitmap; in this case, 32 pixels<BR> <BR> <LI>The width of each bitmap; in this case, 32 pixels<BR> <BR> <LI>Whether or not the image list is masked for transparency; in this case, <TT>TRUE</TT><BR> <BR> <LI>The number of bitmaps stored initially in the image list; in this case, three<BR> <BR> <LI>The "grow-by," or the number of bitmaps added when the image list is expanded; in this case, one</UL><P><FONT COLOR="#000077"><B>New Term:</B></FONT><B> </B>A <I>masked image list</I>is an image list that contains two bitmaps for each image--the second bitmap is amask that is used when drawing transparent images. Parts of the image that are visibleare colored black in the mask, parts that are transparent are colored white in themask.<H3><FONT COLOR="#000077"><B>Displaying an Image List Using the <TT>CImageList::Draw</TT>Function</B></FONT></H3><P>Individual items stored in an image list can be drawn using the <TT>CImageList::Draw</TT>member function, as shown in Listing 17.4.<H4><FONT COLOR="#000077">TYPE: Listing 17.4. Using CImageList::Draw to display a?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -