Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

Super ImageList and ToolBar generator

0.00/5 (No votes)
22 Apr 2004 3  
A drag & drop ImageList and ToolBar generator . Simplifies creation of large image lists and supports effects .

Please Note

If you like this and find it usefull you should rate it. It`s my only satisfaction for writing this. ;) 10x

Introduction

What is this for? Why should I use this software.

It's quite simple: you have to build an application with a tree control and you need images for the branches. You have to create a bitmap with all of them and then create the image list, set transparency color, etc.

If you have 100 gifs you want to use the problem is big. This program can generate a bitmap with 100 gifs in 2-3 seconds. It also generates the resource script and defines if you want to use this as a toolbar and provides code to integrate this bitmap to a image list.

You can add 3 effects to the images: Lighten, Darken and Grayscale . It also supports a plug-in framework for your own custom processing of the image before generation. So , using this a toolbar is ready in a few minutes.

If images are smaller then the toolbar button size you set then you can assign some alignment settings.

The entire UI has tips so using it will be rather easy. The help section is filled-in so you can read a more detailed description of the functionality and functions of this software.

It provides a great integration with the CTrueColorToolbar class. So , this is intended to make the lives of those of us fighting with image lists easier.

For further image processing you can integrate the CxImage library but I did not find this absolutely vital, although integration is very simple.

How it Works

You have to set the root directory where the files will be generated and then:

  • add images
  • set button sizes
  • set effects (if required)
  • set alignment (if required)
  • and press generate .

The file will also "spit" a .html file containing all the images with the src="original image") and the alt="Toolbar Button ID , Index". The index you use when you use an image list. So if you have 200 images you can search in this html the one you want and it will tell you its index.

HTML Helper

Even if this might not be the most simple solution it`s the closest thing available.

Convert Image to Source Code

I added another function. It generates the Bitmap as an array and gives you the possibility to use that bitmap without requiring a bitmap resource.

//The Acrobat Reader icon .

DWORD ImageBits [16][16]={
  {0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,
0xf76b6b,0xde7b7b,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8},
  {0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xef8484,
0xff9c9c,0xbd6363,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8,0xd4d0c8},
  {0xd4d0c8,0xc66b63,0xc66b63,0xc66b63,0xc66b63,0xc66b63,0xc66b63,0xff8c9c,
0xd63942,0xce5a5a,0xc66b63,0xc66b63,0xc66b63,0xd4d0c8,0xd4d0c8,0xd4d0c8},
  {0xde4263,0xb56b73,0xad738c,0xad7b8c,0xc68494,0xce8c9c,0xce9cad,0xceadad,
0xe7737b,0xe79494,0xd6adad,0xcea5ad,0xe7848c,0xc65252,0xd4d0c8,0xd4d0c8},
  {0xde4263,0xad8484,0x9c9c9c,0xadadad,0xc6c6c6,0xd6d6d6,0xdedede,0xefefef,
0xef8484,0xe79494,0xf7f7f7,0xefefef,0xefc6c6,0xc6636b,0xd4d0c8,0xd4d0c8},
  {0xde425a,0xad8484,0xa5a5a5,0xbdbdbd,0xd6d6d6,0xdedede,0xefefef,0xffe7e7,
0xe76b6b,0xf77b7b,0xfff7f7,0xffffff,0xf7ced6,0xc66b73,0xd4d0c8,0xd4d0c8},
  {0xde4242,0xb58c8c,0xadadad,0xc6c6c6,0xd6d6d6,0xe7e7e7,0xefefef,0xf79c9c,
0xe7adad,0xffd6d6,0xef8484,0xfff7f7,0xffe7e7,0xc68484,0xd4d0c8,0xd4d0c8},
  {0xde4242,0xb58c8c,0xadadad,0xc6c6c6,0xd6d6d6,0xe7e7e7,0xf7efef,0xe76b6b,
0xf7f7f7,0xffe7e7,0xf79494,0xf74242,0xff6363,0xd65252,0xe76363,0xffb5b5},
  {0xde4242,0xc69c9c,0xbdbdbd,0xc6c6c6,0xcecece,0xdedede,0xef9c9c,0xe79494,
0xe79494,0xe79494,0xe79494,0xe79494,0xe79494,0xd66b6b,0xd66363,0xad3939},
  {0xde4242,0xcea5a5,0xc6c6c6,0xcecece,0xcec6c6,0xe79494,0xd66b6b,0xe7e7e7,
0xf7f7f7,0xffffff,0xf7f7f7,0xefefef,0xf7ced6,0xc68484,0xceadad,0xefe7e7},
  {0xde4242,0xd6adad,0xcecece,0xd6bdbd,0xd67373,0xd6525a,0xc6c6c6,0xdedede,
0xe7e7e7,0xefefef,0xe7e7e7,0xdedede,0xe7bdbd,0xc66b63,0xd4d0c8,0xd4d0c8},
  {0xde3142,0xe7bdbd,0xdedede,0xd68484,0xce5a5a,0xbd9c9c,0xcecece,0xcecece,
0xd6d6d6,0xd6d6d6,0xd6d6d6,0xcecece,0xd6b5b5,0xbd6363,0xd4d0c8,0xd4d0c8},
  {0xde2939,0xe7bdbd,0xe7e7e7,0xd6d6d6,0xc6c6c6,0xcecece,0xcecece,0xc6c6c6,
0xc6c6c6,0xc6c6c6,0xc6c6c6,0xbdbdbd,0xc6a5a5,0xb55252,0xd4d0c8,0xd4d0c8},
  {0xd62129,0xefc6c6,0xf7f7f7,0xe7e7e7,0xdedede,0xcecece,0xcecece,0xbdbdbd,
0xbdbdbd,0xb5b5b5,0xadadad,0xadadad,0xbd9494,0xb55252,0xd4d0c8,0xd4d0c8},
  {0xde2139,0xff6b7b,0xff8c9c,0xff8c8c,0xe77394,0xd66b8c,0xce638c,0xc66384,
0xc65a73,0xc65a6b,0xc6636b,0xc66b6b,0xc65a6b,0xb54252,0xd4d0c8,0xd4d0c8},
  {0xd4d0c8,0x8c1829,0x8c2929,0x7b2929,0x731829,0x731829,0x731829,0x731829,
0x731829,0x731829,0x731829,0x732929,0x732929,0xd4d0c8,0xd4d0c8,0xd4d0c8}
};

//Below is the code 4U2 use 2 show it on CDC named destinationDC

CBitmap hBitmap;
CDC hdcCompatible;
hdcCompatible.CreateCompatibleDC(&destinationDC);
if(hBitmap.CreateBitmap(16,16,1,sizeof(RGBQUAD)*8,&ImageBits))
{
	hdcCompatible.SelectObject(&hBitmap);
	destinationDC.BitBlt(0,0,16,16,&hdcCompatible,0,0,SRCCOPY);
	hBitmap.DeleteObject();
	hdcCompatible.DeleteDC();
}

Plug-ins

You can add a plug-in built by you to further process the images. This transforms the images in shades of navy-blue. A plug-in exports these 2 functions:

void APIENTRY ProcessPixels(RGBX* Pixels,RECT Rect,UINT BWidth,UINT BHeight);
void APIENTRY ProcessHDC(HDC DC,RECT Rect,UINT BWidth,UINT BHeight);

Examples

FX Grayscale
FX : Lighten 50%
FX : Darken 50%
Plugin : XPlize

Background

This article makes use of CPicture available here on CodeProject, and CTrueColorToolbar. For the interface it has integrated the CoolControlsManager and my ToolTipCtrlEx. To add image files you simply drag & drop them from Windows Explorer. If images are compatible they are added and some information on them is displayed.

History

  1. 11.02.2003: First release .
  2. 11.02.2003: Added new function : Convert Image To Source Code .
  3. 12.02.2003:
    • Used .dan.g.'s sugestion and inspired from his code and now the pixel processing is lightening fast. The progress bar doesn`t show the progress of by pixel editing because of perfomance (anyway it takes less than a second).
    • Fixed a few BUGS
    • Used it internally (as demo)
    • Provided projects in VC6
  4. 21.04.2004 : Added custom background color for images

If you like this article and find it usefull, please rate it. Maybe I'll develop it a little further, providing some visual editing mode. But this functionality is perfect if you get how it works.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here