1.1 QHTML Introduction

1.1.1 Introduction

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.

1.1.2 Description-based User Interface Specification

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:

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:

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).


Donatien Grolaux
Version 1.3.0 (20010902)