23.12.2012 Views

ZK Developer's Guide

ZK Developer's Guide

ZK Developer's Guide

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Creating Custom Components<br />

languagename<br />

The language of the addon. The possible languages are defined<br />

in the lang.xml file which is provided from the <strong>ZK</strong> framework.<br />

addon-name The name of the addon. The addon name is the identifier for the<br />

addon. That name must be unique for one web application.<br />

componentname<br />

The name of the component. This name is used in the ZUL files<br />

to integrate the component.<br />

extends This is same as the extends in a Java class. Here, we define the<br />

base component.<br />

property Inside property, we define the predefined attributes for<br />

the component.<br />

To register a language-addon, we have two possibilities. The first one is to place the<br />

file into the metainfo/zk directory, and name it language-addon.xml. Another way<br />

is to register the file inside the optional configuration zk.xml file. This file has to be<br />

located inside the WEB-INF directory. The zk.xml file to register a language-addon<br />

is depicted.<br />

<br />

<br />

<br />

/WEB-INF/my-addon.xml<br />

<br />

<br />

Now we can use the component inside the pages.<br />

<br />

A language-addon can do many more things for you. For example,<br />

with the component-class attribute you can provide your own class<br />

for the component. Just look into lang.xml file of the zul.jar file of the<br />

<strong>ZK</strong> framework.<br />

Macro Components<br />

Beyond the possibility of customizing existing components with the help of CSS files,<br />

it's also possible to create new components based on existing ones. In our sample<br />

login page, we used a label followed by a textbox component. Now we will replace<br />

that component with a component that has a label, and a textbox.<br />

<br />

<br />

<br />

[ 142 ]

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!