福网

ZK AJAX 学习笔记第八天 zk的Tree

ZK AJAX 学习笔记
—-Run Java and JSP on ZK

最近忙于期末考试,写这篇文章还是回答网友问题

打开前面的zk_jsp_java工程,新建tree文件夹并依次添加jsp文件index.jsp,welcome.jsp, likezk.jsp, lovezk.jsp,内容如下:

index.jsp

<%@ page language="java" pageEncoding="UTF-8"%>

<html xmlns:x="http://www.zkoss.org/2005/zul">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Tree</title>
</head>
<body>
<x:hbox>
	<x:tree id="toc" use="edu.bigc.zk.tree.ZkTree" vflex="true"
		width="200px">
		<x:treecols>
			<x:treecol image="/resource/images/gohome.png" label="欢迎" />
		</x:treecols>
		<x:treechildren>
			<x:treeitem id="s1" label="欢迎" image="/resource/images/wizard.png"
				value="/tree/welcome.jsp" />
			<x:treeitem id="s2" label="你喜欢zk吗?" image="/resource/images/help.png"
				value="/tree/likezk.jsp">
				<x:treechildren>
					<x:treeitem id="s3" label="当然喜欢!" image="/resource/images/tux.png"
						value="/tree/lovezk.jsp" />
				</x:treechildren>
			</x:treeitem>
		</x:treechildren>
	</x:tree>
	<x:window id="contents" border="normal" width="99%">
		<x:include id="xcontents" src="${requestScope.contentSrc}" />
	</x:window>
</x:hbox>

</body>
</html>

welcome.jsp

<%@ page language="java" pageEncoding="UTF-8"%>

<html xmlns:x="http://www.zkoss.org/2005/zul">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>欢迎</title>
</head>
<body>
欢迎
</body>
</html>

likezk.jsp

<%@ page language="java" pageEncoding="UTF-8"%>

<html xmlns:x="http://www.zkoss.org/2005/zul">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>喜欢zk吗?</title>
</head>
<body>
喜欢zk吗?
</body>
</html>

lovezk.jsp

<%@ page language="java" pageEncoding="UTF-8"%>

<html xmlns:x="http://www.zkoss.org/2005/zul">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>当然喜欢</title>
</head>
<body>
当然喜欢
</body>
</html>

后台添加java文件ZkTree.java,内容如下:

/* TocTree.java

 {{IS_NOTE
 Purpose:

 Description:

 History:
 Thu Sep 28 19:02:37     2006, Created by tomyeh
 }}IS_NOTE

 Copyright (C) 2006 Potix Corporation. All Rights Reserved.

 {{IS_RIGHT
 }}IS_RIGHT
 */
package edu.bigc.zk.tree;

import org.zkoss.zk.ui.*;
import org.zkoss.zk.ui.ext.AfterCompose;
import org.zkoss.zul.*;

/**
 * The Table-of-Content tree on the left.
 * 
 * @author tomyeh
 */
public class ZkTree extends Tree implements AfterCompose {
	/**
	 * 
	 */
	private static final long serialVersionUID = 1L;

	public ZkTree() {
	}

	public void onSelect() {
		Treeitem item = getSelectedItem();
		if (item != null) {
			Include inc = (Include) Path.getComponent("/contents/xcontents");
			inc.setSrc((String) item.getValue());
		}
	}

	public void afterCompose() {
		final Execution exec = Executions.getCurrent();
		String id = exec.getParameter("id");
		Treeitem item = null;
		if (id != null) {
			try {
				item = (Treeitem) getSpaceOwner().getFellow(id);
			} catch (ComponentNotFoundException ex) { // ignore
			}
		}

		if (item == null)
			item = (Treeitem) getSpaceOwner().getFellow("s1");
		exec.setAttribute("contentSrc", (String) item.getValue());
		// so index.zul know which page to load based on the id parameter
		selectItem(item);
	}
}

运行结果:

其中的一些小图标,大家可以找一些小图片代替

发表评论

电子邮件地址不会被公开。

您可以使用这些HTML标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>