Dynamic labels for buttons with (oddshaped) icon images?

Wilhelm Sanke sanke at hrz.uni-kassel.de
Thu Feb 5 13:54:38 CST 2009


Both Chipp's "ButtonGadget" and Richmond's "Button Basher" automate the 
process of glueing together images with text - and other properties - 
and finally produce buttons with 2 or 4 icon states.

Chipp's application possesses a number of nice and useful features, 
which otherwise you may find only in other commercial or open-source 
Photo tools. Richmond will probably develop his stack in a similar 
direction. It is good to know that there are quite a number of 
possibilities inside Revolution.

Of course one could also use low-priced or free photo tools for such 
tasks, like "RealDraw Pro" (which I use a lot), "PaintShopPro", or "Gimp".

The result of all these approaches are buttons or images with "static" 
text, i.e. text that needs not and cannot be changed - with the 
exception that you could produce different texts, colors etc. for the 
different icon states.

This is probably sufficient for the majority of applications in which 
buttons are being used.

However, in some cases, especially for certain types of educational 
software, you need the feature to be able to *dynamically* change the 
text/label of buttons at runtime.
As an example, imagine a Matching Exercise for second-language learning 
where you have got two columns of 10 buttons each - one columns of 
buttons with words of the first language, the other column for the 
second language - in which you have to drag the matching button near to 
the foreign language equivalent.
Then after all pairs have been correctly matched, a new set of 10x2 
words or expressions are being displayed in the labels of the 20 buttons 
etc. etc.

We use quite a variety of such exercises for the students studying in 
our Language Department that rely on assigning new labels dynamically 
from an attached database or a hidden vocabulary field inside the stack 
itself.

If you just use normal buttons - without icon images - there is of 
course no problem to achieve such dynamic setting of labels, but if you 
choose to be creative with presumeably more appealing buttons with icon 
images and transparent shapes then you run into difficulties:

- The name or label of a button can be displayed on the right or the 
left side of an icon or *beneath* the icon, but not directly *on top* of 
an icon. If the latter would be the case, this would be very convenient 
for dynamic label setting.
About 10 years ago - or maybe even earlier - I had asked Scott Raney to 
introduce such a feature for Metacard, but apparently it was of limited 
priority on his agenda.

- The other possibility to place text directly over icon images is to 
set an icon as a backpattern of the button. This works fine as long as 
the icons are rectangular, when they are oddshaped, however, the 
transparent parts of the image show as black.
I assume that this basically could be changed in a future version of 
Revolution so that the transparent parts of backpattern really would 
remain as transparent.

Lacking such features at present, one workaround would be to take a 
labelles/nameless button with several icon states and to combine the 
button with a graphic/field, grouped together with the button or just as 
an overlay to the button. This is one way to achieve dynamic setting of 
labels at runtime.-

I have put together a very small stack that just shows four different 
icon images and four dynamic button entities which replaceable text; 
this is not an educational exercise, just demonstrating in which ways 
buttons and graphics could be combined.

<http://www.sanke.org/Software/DynamicImageButtons.zip>

(I will be out of home and office for the next three days.)

Regards,

Wilhelm Sanke
<http://www.sanke.org/MetaMedia>



More information about the use-livecode mailing list