How to Overlay Images Using Image List Controls

Last reviewed: September 29, 1995
Article ID: Q125629
The information in this article applies to:
  • Microsoft Win32 Application Programming Interface (API) included with:

        - Microsoft Windows NT version 3.51
        - Microsoft Windows 95 version 4.0
    

SUMMARY

One of the more interesting controls Windows 95 provides as part of its new common controls is the image list. Image lists provide an easy way to manage a group of bitmaps and draw them on the screen, without having to worry about calling CreateCompatibleDC(), SelectObject(), BitBlt(), StretchBlt(), and so on.

One interesting feature that image lists provide through the ImageList_Draw() API is the ability to overlay images -- that is, to draw an image transparently over another image. Calling ImageList_Draw() with the last parameter set to an index to an overlay mask instructs the image list to draw an image, and draw the overlay mask on top of it.

MORE INFORMATION

To overlay images correctly using image lists, follow these steps:

  1. Create a bitmap that will have the images you want to draw as well as the overlay images you want drawn on top of these images.

    For example, say you have a bitmap of four 16x16 images:

        - a green circle.
        - a red circle.
        - a panda.
        - a frog.
    

  2. Create an image list out of the bitmap you've created in step 1 by using ImageList_LoadImage() as shown here:

    hImageList = ImageList_LoadImage (hInst,

                                         "MyBitmap",
                                         16,
                                         4,
                                         RGB (255,0,0),
                                         IMAGE_BITMAP,
                                         0);
    
    

  3. Decide which images you want to specify as overlay masks, and tag them as such by using the ImageList_SetOverlayImage() function. The following code specifies the panda and the frog (with 0-based index, this comes out to image 2 and 3) as overlay masks 1 and 2.

    NOTE: You can only specify up to four overlay masks per image list.

    ImageList_SetOverlayImage (hImageList,

                                  2,         // 0-based index to image list
                                  1);        // 1-based index to overlay mask.
    
    
       ImageList_SetOverlayImage (hImageList,
                                  3,       // 0-based index to image list
                                  2);      // 1-based index to overlay mask.
    
    

  4. Draw the image. The following code draws the green circle (or image 0 in the example image list). Then it draws the panda (overlay image 1 in the example) on top of it.

    ImageList_Draw (hImageList,

                       0,     // 0-based index to imageList of image to draw
                       hDC,   // handle to a DC
                       16, 16 // (x,y) location to draw
                       INDEXTOOVERLAYMASK (1));   // Overlay image #1
    
    


Additional reference words: 4.00
KBCategory: kbui
KBSubcategory: UsrCtl


THE INFORMATION PROVIDED IN THE MICROSOFT KNOWLEDGE BASE IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND. MICROSOFT DISCLAIMS ALL WARRANTIES, EITHER EXPRESS OR IMPLIED, INCLUDING THE WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. IN NO EVENT SHALL MICROSOFT CORPORATION OR ITS SUPPLIERS BE LIABLE FOR ANY DAMAGES WHATSOEVER INCLUDING DIRECT, INDIRECT, INCIDENTAL, CONSEQUENTIAL, LOSS OF BUSINESS PROFITS OR SPECIAL DAMAGES, EVEN IF MICROSOFT CORPORATION OR ITS SUPPLIERS HAVE BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. SOME STATES DO NOT ALLOW THE EXCLUSION OR LIMITATION OF LIABILITY FOR CONSEQUENTIAL OR INCIDENTAL DAMAGES SO THE FOREGOING LIMITATION MAY NOT APPLY.

Last reviewed: September 29, 1995
© 1998 Microsoft Corporation. All rights reserved. Terms of Use.