- Up - | Next >> |
The QHTML module implements a description based abstraction to help programmers efficiently build graphical user interfaces. Windows are built in a declarative way, expressing the widgets that compose the window along with their geometry. Widgets can be dynamically controled using handlers. The user interface itself appear in an Internet browser. For now only Internet Explorer 5.5 and above are supported. Using QHTML it is very easy to create client-server like application where the clients provide the user interface while the server provides the functionalities of the application. As the user interface appears in an Internet browser, the application is available anywhere in the world where an Internet connection exist.
With the QHTML module the user interfaces are defined by descriptions. A description is a record value that defines the initial state of the user interface and several hooks to interact dynamically with it afterwards.
In general, there are three main ways of defining user interfaces:
By means of explicit calls to a user interface toolbox.
By means of an Interface Builder, a graphical tool that allows to create the interface interactively.
By means of descriptions. A description is a data structure that defines the user interface.
QHTML uses the description approach, where the descriptions are record values. (The QHTML Prototyper provides an interactive interface; this regains part of the advantage of using an Interface Builder.) (The Macintosh has popularized the notion of ``resources'', which are graphical descriptions of user interfaces that correspond to records. However, they are intended to be used graphically, through an Interface Builder. They are much more cumbersome to use than records, for example, they cannot be easily calculated in programs.)
The description approach is particularly useful in a symbolic language such as Oz that allows easy and concise creation of data structures. QHTML uses record values, which are well-supported by Oz. For example, the following code defines a record and references it in D:
declare
D=td(button(value:"Show"
action:proc{$} {Show 'Hello World'} end)
button(value:"Close"
action:toplevel#close))
The record with label td
has two fields that define two buttons in two records. It defines a window with two buttons, labeled Show
and Close
, which are linked to the actions of displaying Hello World and closing the window.
There are at least five advantages to using descriptions:
Descriptions are part of the source language. They allow to describe the user interface without leaving the source language.
It is possible to calculate descriptions. For example, if the buttons are arranged in a geometrical pattern (e.g., over a map).
Since descriptions are values, they can be saved in files and loaded at will.
Saving descriptions in Ascii form allows them to be inspected and edited by humans.
Records in Oz are written in a very concise, symbolic way. This means that the description itself is already a kind of visual representation. As a result, the conceptual distance between the description and its user interface meaning is small.
By mixing functions and records, descriptions can be made both concise and readable. Here's an example:
declare
In Out
fun {Txt T H S} lr(glue:nswe
label(value:T)
textarea(handle:H glue:nswe)) end
fun {But T A} button(glue:we value:T action:A) end
D=tdframe(tdframe(glue:nswe
{Txt "Expression" In}
{Txt "Result" Out})
lr(glue:we
{But "Eval" proc {$} V={E {In get($)}} in {Out set(V)} end}
{But "Quit" toplevel#close}))
The result in D
is still a record value, but the source code is shorter. This defines a window with one rubber frame, two text labels, two text boxes (including one with scrollbar), two buttons (each with an action). One of the actions is a procedure that does a calculation (defined by the function E
), the other simply closes the window. The text boxes have 'handles', which allow to do things with the text--here, one of the boxes is read (through the 'get
' method) and the other is written (through the 'set
' method).
- Up - | Next >> |