Drawing the Image

You create the bitmap image with a paint tool. This tool is host-system dependent, as are the images it creates. Under Microsoft Windows, you can use the Paint program that is bundled with Windows. For most bitmap buttons, you will want to use the zoom mode of the paint program to make it easier to adjust the individual pixels.

You create your bitmap as a strip that contains one or more bitmap button faces. For example, the following bitmap image contains 15 button faces:

You can use more than one bitmap image strip in your program; however, the run-time is more efficient when it pulls multiple images from the same strip. In addition, it is usually more convenient to store multiple images in a single file rather than several small files. Note that all images in a particular strip must be the same size.

When you design the image, the first thing you need to do is to settle on the size of the image. The default size under Windows is 15 pixels high by 16 pixels wide. However, you can use any size you want. Note that the bitmap size is the size of the button's image. To accommodate the button's border, the actual button will be somewhat larger. Under Windows, eight pixels are added to the width and seven pixels are added to the height (so the default button size is 24 pixels wide by 22 pixels high). The first thing you should do in the bitmap editor is set the dimensions of the bitmap to the desired size. For example, a strip of six default-size buttons would have an image size 15 pixels high by 96 pixels wide (6 * 16 = 96).

When you draw a strip that contains multiple images, make sure that each image starts on a boundary that is a multiple of the image size. In the default case, your images should start at offset 0, 16, 32, and so on (that is, pixel numbers 1, 17, 33, and so on).

Under Windows, certain colors that you use in the bitmap will be mapped to colors chosen by the user in the Control Panel. This mapping allows you to create buttons that will have the same color scheme as the text-labeled buttons on the screen. The following table names the bitmap colors that are translated, as well as their RGB (red, green, blue) values and the system color that they are translated to.

Bitmap Color RGB Values System Color Used
Black 0, 0, 0 Button Text
Dark gray 128, 128, 128 Button Shadow
Light Gray 192, 192, 192 Button Face
White 255, 255, 255 Button Highlight
Blue 0, 0, 255 Selected Item Background
Magenta 255, 0, 255 Window Background

None of the other colors are translated.

It is best to use light gray as your primary background color. This color ensures that the button's edges (which are supplied by the run-time) blend in correctly.

Note: The color transformation described above occurs only for bitmaps stored in 16-color or 256-color format. Bitmaps stored in 24-bit format (true color) do not contain an internal palette. As a result, there is no efficient way of performing the transformation described above. Bitmaps in 24-bit format will be displayed with their colors unchanged.

Once you have finished creating the bitmap, save it as a file. Under Windows, you may use files in JPEG, PNG, or TIFF format as well as BMP. Once loaded, these other formats can be used in any context that BMP files may be used with no code changes. The recognizable extensions for JPEG files are JPE, JPEG, and JPG, PNG files are PNG, and TIFF files are TIFF, TIF and TFF. See Loading Bitmaps for important information related to these other formats.