DesignBais Tip – Referencing Images

When adding an image in the Form Designer, the default Image File value is DBLOGO.JPG. When referring to images, we use this original Image File value, for example: DBIMAGESPEC<1> = "DBLOGO.JPG" This presents a problem as soon as another image goes on the form and you need to refer to it in code – which DBLOGO.JPG do you want?

Sometimes it’s nice to see something other than the generic DBLOGO.JPG placeholder in the form designer. To do this, you could change the Image File value of an image to something more representative of the data, and then create your own corresponding placeholder images. For example, you could create a LOGOPLACEHOLDER.GIF that looks something like a company logo, or a PRODUCT.GIF, or a CUSTOMER.JPG, etc, and then refer to that name in the form and in code. You don’t always need to create an image, it’s easy to copy/paste images from any web page, just right click an image – and be mindful of image ownership rights.

If you do use placeholders, it’s probably a good idea to standardize placeholder names. For example, all placeholder images should be either a GIF, or all placeholders should be a JPG, but mixing them could be confusing. You might also want to use a standard naming convention, like ensuring the filename has a PH in it: PH.PRODUCT.GIF, PH.CUSTOMER.GIF, etc. This makes it easy to find your placeholders under your c:\db\Images\MyCompany folder. Caution: A valid filename isn’t necessarily a valid field name in DesignBais. PH_PRODUCT.GIF is a valid filename but the underscore may confuse DesignBais which uses underscores to delimit filenames from form names, etc. Stick to using periods in all field names.

But what if we want to display and manipulate more than one product or customer image on the page? To do this, each image must have a unique ID. Creating a series of unique placeholder images is going a little overboard. Rather than referring to an image control as a filename, you can give images a unique name just like any other field. For example, if you have a series of images which are to represent on/off switches, set the Image File value to something like SWITCH1, SWITCH2, etc. (No .GIF or .JPG suffix is required) There isn’t an image called switch1 or switch2, so at design time an empty placeholder for the image will display (the DesignBais logo). But at runtime you can set images using code something like this:

DBIMAGESPEC<1> = "SWITCH1" : VM : "SWITCH2"
DBIMAGESPEC<2> = "MyCompany\On.gif" : VM : "MyCompany\Off.gif"

See the tip on Radio Buttons for an example of this last technique.

The next blog entry will follow-up on this and other image handling tips with a simple example of a thick-client-like toolbar for the top of your page. Feel free to register and post comments about these articles, or e-mail me with suggestions for more material.