image001

GUI Modernization in Panther for Windows

 

Version 5.53 of both 32-bit and 64-bit editions of Panther Client for Windows provides a means for greatly improving the look and feel of Panther desktop applications.  They can now be enhanced to provide a look and feel that is more consistent with that of other desktop applications running on modern Windows operating systems, such as Windows 10.

 

You’ll notice the new look as soon as you run the new prodev32/64.  Push Buttons are flat and become highlighted when the mouse pointer is hovered over them.  Single Line Text widgets have a thin border that is highlighted when given focus.  Most widgets look a bit different.  The 3D look is gone, though, overall, the Panther IDE has not changed.  The built-in screens all look essentially the same.  It’s a snap to do the same for your legacy JAM/Panther application when migrating to Panther 5.53.

 

It’s Either Windows Common Controls or It Isn’t

Whether you are running 32-bit or 64-bit Panther for Windows, you are using software that is based upon Microsoft’s Win32 APIs.  JAM/Pi for Windows, the predecessor of Panther for Windows, was developed in the early 1990’s using the Win16 APIs, and later the Win32 APIs, as well as the Windows GDI and Windows Common Control library.  Panther also provides some custom controls (a.k.a. widgets), that are implemented using these same technologies.  Panther’s Status Bar and Toolbars are based upon Microsoft Foundation Classes, and Panther applications may also use ActiveX controls.  The last major addition to the suite of UI components supported by Panther was Frameset/Splitter support, which came with Panther 4.50, nearly 20 years ago.

 

There is a long history of UI/UX concepts and Microsoft APIs that came after the major UI development work for the Panther GUI framework.  In 2001 Windows XP came out with a new look for its UI.  The 3D look of controls became very subtle, and sharp corners were slightly rounded.  This was done by means of a new version of the Windows Common Control library, Comctl32.dll version 6, and its support for new concepts called “Visual Styles” and “Themes.” These worked in conjunction with a new library, uxtheme.dll.  The UI changes for Panther 5.53 are based upon this Theme library and the changes to the Common Control library that first appeared in Windows XP.

 

The next major change for the Windows UI came with Windows 8.0 .  Windows 8.0 introduced the Metro Style for both UI controls and for UI design concepts for Windows.  Originally designed for use on tablets and phones, the Metro Style removed the 3D effect altogether, and relied less on detailed iconography.  It was better suited for single page apps as opposed to business applications that typically use densely detailed pages and multiple Windows.  It practically took the “Windows” out of the Windows Operating System, yet it persists to this day.

 

What’s New is Old Again

As the years have passed and new implementations of Windows and Windows APIs have evolved, the Metro Style has variously been known as the Modern UI, Microsoft Design Language (MDL), Fluent Design System, and Windows Store Apps.  It is also used by the most recent set of APIs and framework for building Windows applications, the Universal Windows Platform (UWP).

 

With each new release of Windows, however, Windows Common Controls, both version 6 with theme support and version 5, without theme support, have continued to be supported, along with Win32 applications in general, as well as every other type of Windows application since.  (i.e. WinForms, .NET, etc.).  Any concerns that applications should be rewritten for UWP should be alleviated by Microsoft’s continued efforts to integrate older technologies with UWP.  It leads one to believe that there are no plans to ever remove support for these older technologies. 

 

Although Windows 10 makes heavy use of Fluent Design up front, there is still a reliance on applications that use the Windows Common Control library, or some framework built on top of it.  The Common Controls, with their “Visual Styles” and Theme support library, still do much of the heavy lifting.  For example, the Settings App in Windows 10, though nearly a complete reimplementation of the old Control Panel application, still opens Control Panel dialogs in order to allow users to make changes for some of the finest details within some categories of options.

 

In fact, the entire Control Panel application is still available in Windows 10, even though the Settings App duplicates most of it.  Throughout the applications and interfaces that come with Windows 10 there is still a reliance on Visual Styles, Themes, and Common Controls.  It is sometimes barely noticeable, though, because the default themes of Windows 10 make these controls look totally flat, and similar to those of an app developed with one of the APIs that use the Fluent Design System.

 

There lies the beauty of this approach.  If your application uses version 6 or later of the Common Controls library and has enabled Theme support, then no matter which version of the Windows OS your application is running on, it can always look correct and somewhat modern for that version of Windows.

 

Themes and Schemes and Things

Back in Windows 3.0 there was a Control Panel dialog box titled, Color Schemes.  This dialog existed with various titles in different versions of Windows up through Windows 7.  In Windows 7, the Control Panel’s Personalization item had a Window Color link near the bottom, and this link opened the Window Color and Appearance dialog box, but only if the currently selected theme was Windows Basic, Windows Classic, or one of the High Contrast themes.  This was essentially the same as the Color Schemes dialog box of Windows 3.0.  It permitted colors to be assigned for Title Bars, Window backgrounds, foreground text, 3D Objects, etc.  These could be saved in Windows 3.0 as a user defined Color Scheme. 

 

In Windows 7 you could save your changes as a new Theme with whatever name you chose, though, technically, some of these so-called themes did not support use of the theme library, uxtheme.dll, at all.  In fact, true theming may be disabled in Windows 7.  For other themes, where theming is enabled, basic colors of individual Windows text and decorations cannot be manipulated within the Windows UI.

Interestingly, the basic colors for various elements remain defined within the Windows Operating System, even in Windows 10, no matter which theme is in use.  A theme simply has predefined settings for these as well as very many more configuration parameters (a.k.a Visual Styles), that were never available without use of the theme library.  Themes can also support visual styles for the UI such as sounds, gradient color effects, the timing for transition effects, a desktop background image, etc.

 

Panther uses styles colors defined by the Windows OS for foreground and background colors, and even shadow colors for 3D objects that it paints with custom code when a Color Type property of Scheme is chosen.  (This is true provided that the default is not overridden by something in the SMCOLMAP file.)  The property value “Scheme” harkens back to the terminology of Windows 3.0, but one may translate this as “Theme”, to use the more modern jargon, whether or not theme support is enabled for Panther 5.53 or not.  This will be discussed further in a subsequent section.

 

Windows 8 removed the Windows Classic and Windows Basic themes, and introduced a Metro Style interface to replace the Windows Color and Appearance dialog box for manipulating colors.  This new interface is used for only the High Contrast themes, and is carried forward to Windows 10, with only minor changes.

 

Uncommon Customs

In practice, simply enabling theme use by the use of version 6 of the Common Control library in an older version of Panther does not achieve a modern look for a Panther application.  Only some of Panther’s widgets are true Common Controls.  The Single Line Text (SLT) widget and Multiline Text (MLT) widget, for example, look like the Windows Edit Control, but really are not.  They are a single custom control that can be configured by Panther as either an SLT or an MLT.  There was, and still is, custom code in Panther to paint them with that 3D look of old, though now there is new code to paint them correctly for the current theme when Panther is configured to use the Theme library with version 6 of the Common Control library.  There was, and still is, custom code that can paint Panther’s Push Button widgets with that 3D look.  But there is now also new code that can paint Push Button widgets in accordance with the visual styles for a “Button” in the current theme.

A further complication is that Panther has always permitted the application developer to assign whatever foreground or background color was desired for most Panther widgets.  Therefore, theme colors can be used as defaults, but must be able to be overridden.  As previously stated, a Color Type widget property of Scheme allows Panther to use the colors defined by the current theme, provided that they are not superseded by Scheme colors defined within the SMCOLMAP file.

Another complication is that for a Push Button with pixmap properties Panther needs to be able to paint the desired pixmap on a Push Button that is drawn using a border in the style of the current theme.  Also, for pixmaps that use GIFs with transparency, transparent parts must work correctly with respect to any theme background color that should show through.

For all of these reasons and more, older Panther applications cannot be modernized using the techniques discussed in the following section without upgrading to Panther 5.53.

(Note that a few Panther widgets that use custom painting code have not been updated to support a new look.  These include Grid Frame widgets, Toggle buttons, and widgets contained within a Grid Frame.)

 

Manifest Destiny

The key to enabling a Panther 5.53 application to use the Theme library with the Common Control library is to use a manifest file for the application that tells Windows to load version 6.0 or later of Comctl32.dll rather than version 5.82, which is the default.  There is also an old 3D option in the INI file that was typically set to Yes, but in recent versions of Panther, affects only Single Line Text Widgets.   INI files provided with Panther 5.53 have this option commented out.  When commented out, the default depends upon whether Theme use is enabled.  When enabled, the default for the 3D option is No, and a thin non-3D border is used for Single Line Text widgets and Multiline Text Widgets.  Also, that border is highlighted when the widget has focus.  When Theme use is disabled, the old 3D border is drawn.

Theme use is always disabled when using version 5.x of Comctl32.dll.  It is generally enabled when using version 6.x of Comctl32.dll.   It is always enabled for Windows 10 when using version 6 of Comctl32.dll.  Older versions of Windows also supported the Windows Classic Theme, for which theme use was disabled.

Manifest files are provided in the link directory of the Panther 5.53 Client installation in order to enable the use of version 6.0 of Comctl32.dll for the main Panther executables that use the Common Control library.   Each manifest file that is provided has nearly identical content, its purpose being solely to cause the desired version of Comctl32.dll to be loaded.  Other content and other uses are possible, but will not be discussed here.   The presence of a manifest file in the same directory as an executable, having the same base-name as the full name of the executable, including the ‘.exe’ extension, but with the additional filename extension of ‘.manifest’, is sufficient for that manifest file to be used by Windows when the executable is loaded.  This is the technique used for prodev32/64, prorun32/64, and mbedt32/64, as provided in Panther 5.53.  The manifest files may be removed by the user in order to restore the old look of these applications.  This may be necessary if the new look has a negative impact on existing application screens.

(Note: It may be necessary to rename the executables or copy them elsewhere when removing or adding a manifest file in a directory where the executable has already been run one or more times.  Windows may “remember” which version of Comctl32.dll was last used, and continue to use that version of the DLL, rather than the one specified by the manifest file.)

 

Linking in the Manifest File

It is possible to link a manifest file into the Panther executable so that the user has no choice as to which version of Comctl32.dll is used.  Panther provides prodev.exe.manifest and prorun.exe.manifest in the link directory of the installation.  These files do not have the exact names of the executables that are built by the makefile so that they can have no effect unless linked in.  They will not be linked in by default.  Resource files are used to control that.  In order to link them in, uncomment the lines in prodev.rc and prorun.rc that are indicated for that purpose in the comments near the top of these resource files.

If you do not wish to link in a manifest file, but wish to use it with your executable, simply rename prorun.exe.manifest and copy it to where your application’s EXE file is installed. For example, if your application is named myapp.exe, rename prorun.exe.manifest to myapp.exe.manfest, and make sure that the EXE and manifest file are always distributed together in the same folder.  Also, for an existing application that is being migrated to use Panther 5.53, it is recommended to comment out the line that says, “3D=Yes” in its INI file.

An advantage to not linking in the manifest file is that it can simply be removed to disable theme use for you application, provided that you take into consideration the note in bold at the bottom of the previous section.

 

Caveats

·        Push Buttons on Panther Screens are custom painted, while Push Buttons on built-in Windows dialog boxes are not.  Therefore, they may look slightly different.  Background theme colors, particularly for color changing effects when hovering or pressing Push Button widgets are a close approximation to those used in built-in Windows dialog boxes, but may not be an exact match.  Color changing effects for background colors on Push Buttons use a proprietary algorithm to manipulate luminance.  This algorithm may be more appealing for custom background colors that have a similar luminance for Push Buttons (usually high) as that for Buttons whose background color is defined by the current Windows theme.  Also, Push Buttons on Panther screens do not support fade-in/fade-out for color changing effects.  The transition is immediate when the mouse pointer is moved over or off of a Push Button widget.

 

·        Some widgets may be sized differently due to the thinner border widths used by the modern flat style.  This may cause changes in the positions of widgets on screens.  This may change alignments, shrink screens, or leave extra white space where previously there was little.  In particular, a series of vertically adjacent Single Line Text widgets may appear too close to one another without their 3D borders, and their reduced usage of vertical space may misalign surrounding widgets whose prior alignments were not explicitly configured.  If Single Line Text and Multiline Text widgets are the only major impediments to modernization, the ‘3D’ option in the INI file may be assigned the value ‘Yes’, in order to revert only these widgets to use 3D borders.  The modern flat style and thin borders will remain for all other widgets.  Conversely, if your application is not showing thin bordered flat controls for the SLT and MLT widgets as expected, but is showing other widget types in the flat style, it may be using an old INI file in which the ‘3D=Yes’ option remains in effect.

 

 

·        The default background color for screens is different when theme-use is enabled.  Widgets with assigned background colors that previously matched a screen’s default background color, or were coordinated with it, may not look as desired.  This may also be true for widgets on Tab Dialogs.  In such cases it may be desirable to assign the background color of these widgets to the Basic Color Type with Container as the Color Name.