2.3.1 Placing all the elements in a single layout

The main part of the task list manager is a list box that is used for displaying the tasks that you add in the course of using the program. For the initial design, there are buttons that let you add and remove tasks from the list, and a text field into which you type the text for new tasks.

To begin with, the following code creates all these elements, and places them in a single window, one above the other.

make(<column-layout>, 
      children: vector (make (<list-box>, items: #(), lines:15),
                        make (<text-field>, label: "Task text:"),
                        make (<push-button>, label: "Add task"),
                        make (<push-button>, 
                              label: "Remove task")));

You might notice a number of problems with this initial design:

Firstly, the items have all been created correctly, but the resulting window is not particularly attractive. In order to improve the appearance, you need to rearrange the elements in the window by making better use of the layout facilities provided by DUIM.

Secondly, the application does not yet look very much like a typical Windows application. Rather than individual buttons, the application should have a tool bar, and it is not common to have a text field in the main window of an application. There is no menu bar. Currently, the application has more of the feel of a dialog box, than a main application window. These issues are addressed later on in the example.

---

Building Applications Using DUIM - 26 May 1999