Day 023 - Visual enhancements and the mystery of planes

Lesson 3.4 in the tutorial is titled "Ergonomics of the Application". I've always thought of ergonomics as being primarily biomechanical, but that's not the definition the tutorial seems to have in mind. This is all about the visual appearance of the application.

The tutorial explained how to associate a new style with an application by going to Project | Project Description and choosing a new style book:

This didn't seem to work for me, as the application still had the same appearance as before. So instead I tried Project | Other Actions | Apply a skin template to the project...

That worked a treat, and did recompile the project where the previous option hadn't resulted in any noticeable activity. 

When you apply a skin you have several options, including whether to force the style on controls that have no associated style, whether to update layouts, whether to keep style overloads etc. 

You can create your own skin templates, although the tutorial doesn't go into any detail on that subject. 

Anchoring

Windows can be resizable, in which case you need to define anchoring. You can do that via the Gui tab.

 

The anchoring window options include positioning without resizing (top, buttom, left, right, center), changing width and/or height, and spreading controls horizontally or vertically. 

You can also set custom percentages for the anchor positions and for width and height. You can also set anchoring in code via the control properties. 

Tab order

You can have WinDev automatically set the tab order, and you can customize the tab order by buttons or by dragging/dropping:

The tab order editor will not let you move a control to an illegal position. 

Note that the tab order editor has a "Plane to edit" drop list. I think I've mentioned planes before - you can think of them as layers of controls which you can hide/unhide as you like. They're also much like wizard-style tabs. 

Checking control alignment

Even with standard issue battleship gray browses and forms, it seems like control positioning is always a problem, especially when a team is involved. How do you enforce standards for control spacing, margins etc? 

WinDev doesn't have any magic solution to this problem (at least not that I've seen) but it does have a pretty cool alignment feature. 

Use Display | Toolbars | Alignment to bring up he Alignment toolbar if it isn't already visible. 

Then select some controls on the window and hover your mouse over the various alignment toolbar buttons:

As you hover, the controls move to the position they would be in if you selected that alignment option. Sweet.

Planes and tabs

Controls can be associated with planes, tabs, or even sidebars; right-click on the control and choose the desired association. 

If you're using planes you need to write code to move from one plane to another, since there are no tabs that let the user choose which plane to see. not the user's control). 

It took me a while to wrap my head around the concept of planes. They're not quite like wizard tabs, in that a wizard tab (in Clarion at least) is a specific control, and while it may take up the whole area of the window, it doesn't have to. But a plane is a logical grouping of controls, not a control itself. 

Click on Associate with a plane... and you get this window:

There are 98 blank planes listed in that window. Each covers the entire window. To move to a plane just press PgUp/PgDn - the number of the current plane will be displayed in large type in the upper right hand corner of the window editor. If you don't see a number then you're on the window itself (no plane). 

You specify the plane to display in code with

MyWindow..Plane = <some value>

It appears that any controls on the window (plane 0?) will always be displayed but I haven't actually tested that. 

Tomorrow I'll continue on page 213.