ZUML

Overview

There are two ways to compose UI: XML-based approach and pure-Java approach. Here we describe XML-based approach. For pure-Java approach, please refer the next chapter.

The declaration language is called ZK User Interface Markup Language (ZUML). It is based on XML. Each XML element instructs the ZK Loader which component to create. Each XML attribute describes what value to be assigned to the created component. Each XML processing instruction describes how to process the whole page, such as the page title. For example,

<?page title="Super Application"?>
<window title="Super Hello" border="normal">
    <button label="hi" onClick='alert("hi")'/>

where the first line specifies the page title, the second line creates a root component with title and border, and the third line creates a button with label and an event listener.

This chapter is about the general use of ZUML. For a complete reference, please refer to ZUML Reference.

Basic Rules

If you are not familiar with XML, please take a look at XML Background first.

A XML Element Represents a Component

Each XML element represents a component, except special elements like <zk> and <attribute>. Thus, the following will cause three components (window, textbox and button) being created when ZK Loader processes it.

<window>
  <textbox/>
  <button/>
</window>

In additions, the parent-child relationship of the created components will follow the same hierarchical structure of the XML document. In the previous example, window will be the parent of textbox and button, while textbox is the first child and button is the second.

---

Version History

Last Update : 2010/11/4

Version	Date	Content