5 The images parameter

This is a database table parameter. Please refer to 2.2 for a detailed explanation of database tables layout. In all the following examples we assume that the recordseparator is ^ and the fieldseparator is | .

Column Name Type default Range
0 Key string No default, obligatory field  
1 The image’s location URL No default, obligatory field Fully qualified URL’s as well as relative URL’s are supported (see 3.12)
2 X coordinate Integer 0  
3 Y coordinate Integer 0  
4 Width Integer Width of the image  
5 Height Integer Width of the image  

 

Column 0 is the (primary) key. This key will be used when referring to this record.

Column 1 is the URL of the image.

Column 2, 3, 4 and 5 define a crop region. If you only need a part of the image, then you can define a crop region

5.1 Background

A special key is "background", it allows you to use an image as your background. If the image is smaller than the surface of the applet, then the background image will be tiled.

<PARAM name=images value="
^background|background.jpg
">

 the background image

Notice that folders are not ‘transparent’. The java language doesn’t allow creating transparent off-screen images. In 5.2 we will demonstrate how you can use external icons with transparent backgrounds.

5.2 Custom images for icons

You can use 1 file per icon or pack different icons in one file. Packing multiple icons in 1 file results in shorter download times because your browser doesn’t need to make multiple internet connections.

We will pack 4 icons with a transparent background in 1 gif image file. Please refer to the manual of your paint program on how to do this.

If we blow this up we get

Now we can define crop regions for the icons that are contained in this image.

We shall only change the default openedfolder and closedfolder icons with their transparent counterparts.

<PARAM name=images value="
^background|background.jpg
^closedfolder|transparent.gif|0|0|16|13
^openedfolder|transparent.gif|20|0|16|13
">

closedfolder starts at the point (0,0), this is the upper left corner, and is 16 pixels wide and 13 pixels high.

openedfolder starts at point (20,0) and is also 16 pixels wide and 13 pixels high