You can choose whatever Servlet technologies you prefer to generate HTML tags. ZK (more precisely, AbstractComponent) uses the include method of javax.servlet.RequestDispatcher to include the HTML tags you generate for the view.
For sake of description, we use DSP (Dynamical Server Page) in most examples. It is a template technology developed by ZK. The use is similar to JSP except you cannot embed Java codes in it. There are several benefits, such as no compilation required, ability to be part of JAR file, no JSP/EL requirement and so on.
When the view being rendered, the related information is passed through the request attribute called arg, which is a Map instance. In arg, the component being rendered is stored in the entry called self. That is, you can retrieve it with the following EL expression:
${requestScope.arg.self}
With Java codes, you can retrieve it as follows.
void doGet(HttpServletRequest request, HttpServletResponse response) {
Component self = (Component)((Map)request.getAttribute("arg")).get("self");
...
Here is the example of org.zkoss.zul.Image's view (in DSP):
<%@ taglib uri="http://www.zkoss.org/dsp/web/core" prefix="c" %>
<c:set var="self" value="${requestScope.arg.self}"/>
<img id="${self.uuid}" z.type="zul.widget.Img"${self.outerAttrs}${self.innerAttrs}/>
where
You have to generate the id attribute with component's UUID.
Generate the required attributes by calling the getOuterAttrs and getInnerAttrs methods of HtmlBasedComponent.
If the view requires some specific JavaScript codes, the z.type attribute might be specified with an unique value to denote the component type.
Notice that each view must have exactly one topmost HTML element – which is img in the above case. The following view is incorrect since it has two topmost element.
<%@ taglib uri="http://www.zkoss.org/dsp/web/core" prefix="c" %>
<c:set var="self" value="${requestScope.arg.self}"/>
<img id="${self.uuid}" ${self.outerAttrs}${self.innerAttrs}/>
<img/>
To correct it, you can enclose them with span or div.
<span id="${self.uuid}" ${self.outerAttrs}${self.innerAttrs}/>
<img/>
<img/>
</span>
Depending on your requirement, you can place the DSP file representing a view in the Web application, or in a JAR library.
If you put in the Web application, say, /WEB-INF/myaddon/button.dsp, just specify the correct path in the mold-uri element as follows.
<component>
<mold>
<mold-name>default</mold-name>
<mold-uri>/WEB-INF/myaddon/button.dsp</mold-uri>
</mold>
...
If you want to put it to a JAR file, you must place it under the /web directory. For example, /web/myaddon/button.dsp is a legal path, and the mold URI is as follows.
<component>
<mold>
<mold-name>default</mold-name>
<mold-uri>~./myaddon/button.dsp</mold-uri>
</mold>
...
where "~." means the /web directory in a JAR file, or locatable by classpath.
DSP is an easy way to design a component view, but the performance of EL expressions is much slower than native Java codes. To maximize the performance with native Java codes, you can develop either a Servlet or a so-called component renderer.
A component renderer is a Java class used to render a view directly. It must implement the org.zkoss.zk.ui.render.ComponentRenderer interface, which has only one method: render. For example, the following is the renderer of Image:
public class ImageDefault implements ComponentRenderer {
public void render(Component comp, Writer out) throws IOException {
final Image self = (Image)comp;
out.write("<img id=\"");
out.write(self.getUuid());
out.write("\" z.type=\"zul.widget.Img\"");
out.write(self.getOuterAttrs());
out.write(self.getInnerAttrs());
out.write("/>");
}
}
Then, the mold URI must start with "class:" and end with the class name, as shown below.
<component>
<mold>
<mold-name>default</mold-name>
<mold-uri>class:org.zkoss.zkmax.zul.render.ImageDefault</mold-uri>
</mold>
...