Next Previous Up Top Contents Index

3 Improving The Design

3.7 Gluing the new design together

In improving the initial design of the application, you have added a tool bar and a status bar. Adding a tool bar, in particular, has obviated the need for some of the elements that you added to the earlier version of the frame design. In this section, you throw away those elements that are no longer needed, and add in the new elements, to create a new, improved design for the frame class.

One part of the initial design you have not yet improved on is the radio box that shows the priority of any task in the list. Ideally, rather than using a radio box, you would display the priority of each task alongside the task itself, within the list box. For now, however, keep the radio box.

pane priority-box (frame)
  make (<radio-box>,
        items: $priority-items,
        orientation: #"horizontal",
        label-key: first,
        value-key: second,
        value: #"medium",
        activate-callback: not-yet-implemented);

Notice that the orientation is no longer constrained to be vertical. In the new design, a horizontal radio box looks better. By default, the orientation of a radio box is horizontal, so you could just completely remove the initialization of the orientation: init-keyword from the definition of the pane. In general, though, if you care about the orientation of a gadget, you should specify it explicitly, so leave the init-keyword in the pane definition, and change its value, as shown above.

Next, notice that the items are now specified using a named constant, rather than by embedding literals in the pane definition. The definition of this constant is as follows:

define constant $priority-items
  = #(#("Low",    #"low"),
      #("Medium", #"medium"),
      #("High",   #"high"));

Add the definition for this constant to frame.dylan.

Using lists of string and symbol values in this constant lets you assign values to the individual components of the radio box elegantly, in conjunction with the other improvements to the definition of priority-box.

Assigning first to the label key of priority-box ensures that the first element from each sub-list of $priority-items (the string) is used as the label for the appropriate item. Thus, the first button in priority box is labeled "Low".
Assigning second to the value key of priority-box ensures that the second element from each sub-list of $priority-items (the symbol) is used as the value for the appropriate item. Thus, the first button in priority box has the value #"low".

Lastly, priority-box is given a default value: #"medium". This ensures that the button labeled "Medium" is selected by default whenever priority-box is first created.

The definitions for add-button, remove-button, and task-list remain unchanged from the initial design. In addition, you need to add the definitions for open-button and save-button described in Section 3.5 on page 19.

You also need to add in the definitions for the tool bar and status bar themselves, as described in Section 3.5 on page 19 and Section 3.6 on page 21.

The definition for task-layout has become much simpler. Because you have added buttons to the tool bar, the main layout for the application has reduced to a single column layout whose children are task-list and priority-box.

The definition for the new design of the frame class now looks as follows (button definitions vary slightly for the Task List 2 project, see Appendix A.2, "A task list manager using command tables"):

define frame <task-frame> (<simple-frame>)
// definition of buttons
  pane add-button (frame)
    make(<push-button>, label: "Add task",
         activate-callback: not-yet-implemented);
  pane remove-button (frame)
    make(<push-button>, label: "Remove task",
         activate-callback: not-yet-implemented);
  pane open-button (frame)
    make(<push-button>, label: "Open file",
         activate-callback: not-yet-implemented);
  pane save-button (frame)
    make(<push-button>, label: "Save file",
         activate-callback: not-yet-implemented);

// definition of radio box pane priority-box (frame) make (<radio-box>, items: $priority-items, orientation: #"horizontal", label-key: first, value-key: second, value: #"medium", activate-callback: not-yet-implemented);

// definition of tool bar pane task-tool-bar (frame) make(<tool-bar>, child: horizontally () frame.open-button; frame.save-button; frame.add-button; frame.remove-button end);

// definition of status bar pane task-status-bar (frame) make(<status-bar>, label: "Task Manager");

// definition of list pane task-list (frame) make (<list-box>, items: #(), lines: 15, activate-callback: not-yet-implemented);

// main layout pane task-layout (frame) vertically () frame.task-list; frame.priority-box; end;

// activation of frame elements layout (frame) frame.task-layout; tool-bar (frame) frame.task-tool-bar; status-bar (frame) frame.task-status-bar;

// frame title keyword title: = "Task List Manager"; end frame <task-frame>;

Note that this definition does not incorporate the original task-text pane defined in Section 3.4, "Defining a new frame class". In fact, this part of the original interface is handled differently in the final design, and is re-implemented in Section 3.8, "Creating a dialog for adding new items".


Building Applications Using DUIM - 26 May 1999

Next Previous Up Top Contents Index