It is always good if the UNIFACE lab invents beautiful widgets like the tabEx or extends the command button. But what if you have an existing application running and you don’t have the means to break it open to change it? This blog post’s focus is on changing the look and feel of an existing application without opening the sources. Further in the post, I give a sample on color inheritance which also can be used in combination with the newly introduced options for styling.
In the past the UNIFACE lab introduced new ini file settings for “window”, “defentity” and the “shell”. The idea behind these logical widgets with their properties is that an existing UNIFACE application can be styled after it is implemented without breaking open the sources. This enables a value added reseller to deliver an application in the colors of a particular customer while for another customer logos can be added to forms or application shell.
In UNIFACE 9.6 this approach of restyling the application is brought to an higher level. Added are the menu’s, Tab widget, panels and the command button. Together with color inheritance, I tell later more about this, it is a complete set. Still the lab is extending the list of widgets supporting the individual style attributes or properties as they are called.
The following picture shows the old gray and boring menu which is the standard windows menu in IDF:
By defining the menu=umenu() and some colorful property value’s things start to look completely different:
If we copy the properties from the menu to the panel we can blend the panel with the menu’s:
Many properties of the menu will be ignored by the panel, but as a lazy developer I like to copy the long property collection of the menu into the panel=upanel line. And indeed it works and looks good, if you like light yellow back ground with red letters.
Do not forget to set the panel definition in the setup to “user defined:”
With this setting the panel=upanel line is read by the UNIFACE runtime.
That same property line can be copied to the commandbutton widget. Only here you have to add the representation=UNIFACE property otherwise all color properties are ignored. If you run on Windows eight it is good practice to set the backcolorfill property to “flat” since Windows eight has a flat interface.
The TabEx widget is a drop in replacement of the existing tab widget so you simply can change the Tab=utab into tab=utabex in the usys.ini file. If you do not specify any property nothing will happen, it looks old and gray. The following picture is a screen shot of the IDF signature editor:
By defining some dodger blue colors the looks can change to:
And for Windows 8 we use the backcolorfill= flat:
In many cases labels have a color=NO setting to blend them into the underlying form. If we change the background color of a window in the usys.ini we can also specify a fore ground color for the form or entity. You cannot see this color directly but when the label has the inheritcolors property set in the usys.ini it will show the form foreground color as well. The checkbox, radiobutton, label and the editbox support this inheritcolors property.
This property becomes very valuable when you use a contained form which lives on different forms in a tab widget or form container. The widgets blend in the form when using the inheritcolors property in the label, checkbox and radiobutton widget. You can use this setting on an editbox however this may conflict with standard GUI look and feel. Here is a contained form with no colors at all. For all widgets the inheritcolors is switched on:
When we show this form in a container which parent has a forecolor=red and backcolor=darkseegreen1 we get the following:
What happened in this case can be seen in the next table which shows the color inheritance of the label in the contained form:
|Label||Inherits Red||Inherits DarkSeeGreen1|
So the label searched all the way up for a color and found the foreground color in the parent form as well as the background color.
Suppose we make the entity on the contained form light yellow with blue then the color of the checkbox and radiobutton will automatically inherit this color:
The following table shows the search path again and here the color of the entity is taken:
|Label||Inherits Blue||Inherits Lightyellow|
Removing the lightyellow only makes the label again darkseegreen1 and the fore color stays blue.
So far this small intermezzo on colors and styling. I hope this helps you in pimping an existing application without too many headaches on code changes.