Component-based UI"
| Line 15: | Line 15: | ||
A page (<javadoc type="interface">org.zkoss.zk.ui.Page</javadoc>) is a collections of components. It represents a portion of the browser window. Only components attached to a page are available at the client. They are removed when they are detached from a page. | A page (<javadoc type="interface">org.zkoss.zk.ui.Page</javadoc>) is a collections of components. It represents a portion of the browser window. Only components attached to a page are available at the client. They are removed when they are detached from a page. | ||
| − | A desktop (<javadoc type="interface">org.zkoss.zk.ui.Desktop</javadoc>) is a collection of pages. It represents a browser window (or a tab or a frame of the browser)<ref>Under portal environment, there might be multiple desktops in one browser window. However, it is really important in the developer's viewpoint.</ref>. | + | A desktop (<javadoc type="interface">org.zkoss.zk.ui.Desktop</javadoc>) is a collection of pages. It represents a browser window (or a tab or a frame of the browser)<ref>Under portal environment, there might be multiple desktops in one browser window. However, it is really important in the developer's viewpoint.</ref>. You might image a desktop represents an independent HTTP request. |
[[Image:ZKEssentials_Intro_MultiPage.png]] | [[Image:ZKEssentials_Intro_MultiPage.png]] | ||
Revision as of 08:48, 3 November 2010
Overview
Each UI object is represented with a component (Component). Thus, composing UI is all about assembling components. To alert UI is all about modifying the states and relationship of components.
For example, as shown below, we declared a Window component, enabled the border (border="normal"), and set its width to a definite 250 pixels. Enclosed in the Window are two Button components.
As shown, there are two ways to declare UI: XML-based approach and pure-Java approach. Furthermore, you could mix them if you like.
Desktop, Page and Component
A page (Page) is a collections of components. It represents a portion of the browser window. Only components attached to a page are available at the client. They are removed when they are detached from a page.
A desktop (Desktop) is a collection of pages. It represents a browser window (or a tab or a frame of the browser)[1]. You might image a desktop represents an independent HTTP request.
A desktop is also the logic scope that an application can access in a request. Each time a request is sent from the client, it is associated with the desktop it belongs. The request is passed to DesktopCtrl.service(AuRequest, boolean), and then forwarded to ComponentCtrl.service(AuRequest, boolean). It also means, the application can not access components in multiple desktops at the same time.
Both a desktop and a page is created automatically when ZK Loader loads a ZUML page or calls a richlet (Richlet.service(Page)). The second page is created when the Include component includes another page with the defer mode. For example, two pages will be created if the following is visited.
<!-- the main page -->
<window>
<include src="another.zul" mode="defer"/> <!-- creates another page -->
</window>
Notice, if the mode is not specified (i.e., the instant mode), Include won't create a new page. Rather, it append all components created by another.zul as its own child components.
- ↑ Under portal environment, there might be multiple desktops in one browser window. However, it is really important in the developer's viewpoint.
Version History
Last Update : 2010/11/3
| Version | Date | Content |
|---|---|---|