detail.zul

ZK是一个Ajax Java Web框架

<?xml version="1.0" encoding="UTF-8"?>

<!--
detail.zul

{{IS_NOTE
	Purpose:
		
	Description:
		
	History:
		Wed Jul 30 11:12:06 TST 2008, Created by jumperchen
}}IS_NOTE

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

{{IS_RIGHT
}}IS_RIGHT
-->
<zk>
	<grid>
		<columns>
			<column width="18px" />
			<column>Content0</column>
			<column>Content1</column>
			<column>Content2</column>
		</columns>
		<rows id="rows">
			<row id="r1">
				<detail id="d1"
					onOpen='l.value = "This is a detail. ---------------"'>
					<label id="l" value="This is a detail." />
					<separator />
					<textbox onOK='alert("test")' />
				</detail>
				<label value="test" />
				<label value="test1" />
				<label value="test2" />
			</row>
			<row id="r2">
				<detail open="true">
					<borderlayout height="500px">
						<north maxsize="300" size="50%" border="0"
							splittable="true" collapsible="true">
							<borderlayout>
								<west size="25%" border="none"
									flex="true" maxsize="250" splittable="true"
									collapsible="true">
									<div style="background:#B8D335">
										<label value="25%"
											style="color:white;font-size:50px" />
									</div>
								</west>
								<center border="none" flex="true">
									<div style="background:#E6D92C">
										<label value="25%"
											style="color:white;font-size:50px" />
									</div>
								</center>
								<east size="50%" border="none"
									flex="true">
									<label value="Here is a non-border"
										style="color:gray;font-size:30px" />
								</east>
							</borderlayout>
						</north>
						<center border="0">
							<borderlayout>
								<west maxsize="600" size="30%"
									flex="true" border="0" splittable="true">
									<div style="background:#E6D92C">
										<label value="30%"
											style="color:white;font-size:50px" />
									</div>
								</west>
								<center>
									<label value="Here is a border"
										style="color:gray;font-size:30px" />
								</center>
								<east size="30%" flex="true" border="0"
									collapsible="true">
									<div style="background:#B8D335">
										<label value="30%"
											style="color:white;font-size:50px" />
									</div>
								</east>
							</borderlayout>
						</center>
					</borderlayout>

				</detail>
				<label value="test" />
				<label value="test1" />
				<label value="test2" />
			</row>
			<row id="r3">
				<detail>
					<vbox>
						<image src="~./zul/img/exclamation.gif" />
						<hbox>
							<label value="Title"
								style="font-weight:bold;" />
							<label value="This is a detail." />
						</hbox>
						<hbox>
							<label value="Summary"
								style="font-weight:bold;" />
							<label
								value=" Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna." />
						</hbox>
					</vbox>
				</detail>
				<label value="test" />
				<label value="test1" />
				<label value="test2" />
			</row>
		</rows>
	</grid>
	<button label="Invalidate Row1">
		<attribute name="onClick">
			r1.invalidate();
		</attribute>
	</button>
	<button label="add Child into Detail 1">
		<attribute name="onClick">
			new Label("new Child ----").setParent(d1);
		</attribute>
	</button>
	<button label="delete Child into Detail 1">
		<attribute name="onClick">
			((Component)d1.getChildren().get(0)).detach();
		</attribute>
	</button>
	<button label="add Child into Row 1">
		<attribute name="onClick">
			r1.getChildren().get(r1.getChildren().size() -1).detach();
			r1.insertBefore(new Label("new Child for Row: " + new Date()), d1);
		</attribute>
	</button>
	<button label="InsertBefore Row1">
		<attribute name="onClick">
			Row r = new Row();
			rows.insertBefore(r, r1);
			new Detail().setParent(r);
			new Label("New Label").setParent(r);
			new Label("New Label1").setParent(r);
			new Label("New Label1").setParent(r);
		</attribute>
	</button>
	<button label="InsertBefore Row2">
		<attribute name="onClick">
			Row r = new Row();
			rows.insertBefore(r, r2);
			new Detail().setParent(r);
			new Label("New Label").setParent(r);
			new Label("New Label1").setParent(r);
			new Label("New Label1").setParent(r);
		</attribute>
	</button>
	<button label="delete first Row">
		<attribute name="onClick">
			((Row)rows.getChildren().get(0)).detach();
		</attribute>
	</button>
</zk>