Thursday, 23 December 2010

XUL

What is XUL and how is it used?  Give examples.

# XUL (Extensible User-interface Language) is created in a standard way to replace data that describes a program's user interface. Traditionally, user interfaces have been a complex work to customize so they would work across different operating platforms such as Windows and Macintosh. Netscape and Mozilla, an open group that develops Netscape, have jointly created XUL to overcome this problem.
The splendour of XUL lies in its simplicity. It is easier to work in comparison to the other interface programming tools found on the ancient days. A few lines of XUL can accomplish for the task where many lines of code were required previously. With a little knowledge, one can create a simple Web browser interface implementing XUL, due to which it may ultimately turn into lower cost for the development of user interfaces. Also, another asset of XUL is its flexibility nature.
Basically, it is a standard way to swap the data that describes a program's user interface, or at least the segment of it which can be managed by programming.
XUL interface is typically defined as three separate sets of components:
·         Content: XUL documents, whose elements describes the skeleton of user interface
·         Skin: CSS and image files, define the outline of an application
·         Locale: The files having user-visible strings easy for software localization
It defines a wide range of elements, which generally belong to the following types:
Top-level elements (such as window, page, etc), widgets (such as label, button, etc), box model (such as box, grid, etc), events & scripts (such as script, key, etc), data source (such as template, rule, etc) and others (such as iframe, browser, etc).

Below is the simple example of XUL:
<?xml version= “1.0”?>
<window title=“Hello world!”
Xmlns=“http://mozilla.org/keymaster/gatekeeper/there.is.only.xul” width=“250” height=“200”>
<hbox fex=“1” align=“center”>
<image src=“Mozilla-big.gif”/>
<text style=“fong-weight: bold;” value=“Hellow World!”/>
</hbox>
</window>
Output of an example:


No comments:

Post a Comment