Using Qt Designer to Create Dialog Boxes for Lua Scripts

One of the features of VR-Forces Lua scripting that makes it so easy to create useful tasks and sets is automatic generation of dialog boxes. This feature makes it so easy to create dialog boxes that our developers often use it to create the dialog boxes for new C++ tasks, instead of using the Qt API. (VT MAK uses Qt, a cross-platform API to create the graphical user interfaces (GUIs) for its products.) Unfortunately, other than providing some support for indenting, the automatically generated dialog boxes are very generic in their layout. Prior to VR-Forces 4.6, if you wanted a dialog box that supported the user with a UI design that was more than utilitarian, you were out of luck. However, in VR-Forces 4.6 we added the ability to use Qt Designer to create custom dialog boxes for Lua scripted tasks and sets. 

Here is an example of how you could use Qt Designer to improve the layout of a dialog box.

Suppose that you have created a new task that has some option buttons, a couple of checkboxes and some data input fields. We also put a separator between the option buttons and the checkboxes. The default dialog box that gets created looks like Figure 1.

Figure 1:

This is a perfectly functional dialog box, but is not aesthetically pleasing. We would like some more space above and below the separator line and we want the heading and altitude fields to be in a group box, as in Figure 2.

Figure 2:

 

We can do this if we edit the layout using Qt Designer, as follows:

1. In the New Script dialog box, select the Use Qt Designer check box.
2. Click the Qt button. Qt Designer opens with the parameters laid out in a dialog box form (Figure 3). Qt widgets are listed in panels on the left side of the window. Other panels are to the right.
3. From the Spacers panel, drag a Vertical Spacer widget above the separator line.
4. In the Property panel on the right side of the window, change sizeType to Fixed and set the Height to 10.
5. Drag another Vertical Spacer widget below the separator line and set its properties.
6. From the Containers panel drag a Group Box widget onto the form.
7. Drag the Altitude and Heading fields into the group box. They will probably look like they are on top of each other.
8. In the Object Inspector panel on the right side of the window, select groupBox.
9. In the toolbar at the top of the window, click the button with three horizontal bars. This lays out the field vertically in the group box. Now the fields should look good.
10. Save the form.
11. Close Qt Designer.
12. Preview the dialog box. It now looks like Figure 2.

Figure 3:

This is just a trivial example, but you now have the full power of Qt Designer to lay out dialog boxes for your new scripted tasks and sets. For complete information about using Qt Designer, please see the Qt documentation.