D-Icons

Royalty Free Icons for Developers and Designers!

Using Icons in Clarion

Multi-Format Icons

Modern icon files often contain more than one size of icon. This is a sensible strategy, because icons are meant to be small, and rather than using some algorithm to calculate what an icon should look like, it allows icon makers to actually include different icon designs for different sizes and color depths. Small icons need careful design - a 16x16 icon is exactly that - there is not much room for artistic scope:

This graphic shows a 16x16 icon in design mode, with the actual icon in real size beside it:

Compare this to the detail you can put in a 32x32 icon (which of course has 4 times as much detail) :

Of course, multi-format icons are a feature of 32 bit operating systems, not 16 bit ones.

The d-crisp icons contain these formats in one icon file:

Note that there are icons in this file that will display correctly under 256 colors. Not essential perhaps for this design, but for this icon (from the d-smart icons) it might make a big difference:

As a comparison, here is a 128x128 gif file resized in clarion:

although you can get any size you like, the lower sizes suffer from distortion because it's hard to design an algorithm that can remove 75%+ of the data, and still end up looking good. This is better done at design time, and that's why we have multi format icons.

Clarion and Icons ...

As a rule, the Clarion 16 bit IDE displays only 32x32 icons. No matter the size of a button you use at design time and no matter the formats within the icon, the icon that the IDE will display will be a 32x32 one.

However, your 32 bit program when compiled should display it correctly. (Apparently Clarion 7 will display them ok in the ide …)

For interest I made a screen with different height buttons using one of the multi-format crisp icons – the text on the button is the button height. All buttons show the same icon. Here it is in the IDE :

And here it is in a compiled program …

There are a couple of things to note –

Left justifying the button generally makes it look better, even if there is no text:

And as a rule (remember the height is in DLUs, not pixels)

- if the height is less than 16 it will display a 16x16 icon

- if the height is less than 25 it will display a 32x32 icon

- if the height is greater than 25 it will display a 48x48 icon, but be careful – look at the 70 height button with 2 widths !

If users are allowed to resize your screens, you will be better off using the multi-format icons but sticking to the above guidelines when designing windows.

This is what a 16x16 icon looks like on a button that is 50 high:

In the ide a 16x16 icon is resized to 32x32 and it looks silly:

But, in a compiled program the 32 bit runtime knows how to handle 16x16 icons:

This would probably look better if the larger one were put there automatically …

Icons on Windows

Next comes the problem of placing icons on windows.

If you place a 16x16 icon on a window, the window formatter places a default 32x32 image control on the window, and stretches the icon and it looks bad:

So if you really want a 16x16 icon on a window on a window you need to tell the Image control to stretch the icon, and explicitly state the size you want.

An example …