Tablelayout"

From Documentation
Line 13: Line 13:
 
= Example =
 
= Example =
 
[[Image:ZKComRef_Tablelayout_Example.PNG]]
 
[[Image:ZKComRef_Tablelayout_Example.PNG]]
 
  
 
<source lang="xml" >
 
<source lang="xml" >
<?xml version="1.0" encoding="UTF-8"?>
+
<tablelayout columns="2">
 
+
<tablechildren>
<?component name="panel" extends="panel" width="200px" height="200px" ?>
+
<panel title="Table 1" border="normal" maximizable="true"
 
+
collapsible="true" width="200px" height="200px">
<zk>
+
<panelchildren>Panel Content</panelchildren>
<label value="3 columns, 1 colspan, 1 rowspan" />
+
</panel>
<tablelayout id="tbl" columns="3">
+
</tablechildren>
<tablechildren id="tc1" colspan="2">
+
<tablechildren>
<panel title="table1" border="normal" maximizable="true"
+
<panel title="Table 2" border="normal" maximizable="true"
collapsible="true">
+
collapsible="true" width="200px" height="200px">
<panelchildren>Panel</panelchildren>
+
<panelchildren>Panel Content</panelchildren>
</panel>
+
</panel>
</tablechildren>
+
</tablechildren>
<tablechildren>
+
<tablechildren>
<panel title="table2" border="normal" maximizable="true"
+
<panel title="Table 3" border="normal" maximizable="true"
collapsible="true">
+
collapsible="true" width="200px" height="200px">
<panelchildren>Panel</panelchildren>
+
<panelchildren>Panel Content</panelchildren>
</panel>
+
</panel>
</tablechildren>
+
</tablechildren>
</tablelayout>
+
<tablechildren>
</zk>
+
<panel title="Table 4" border="normal" maximizable="true"
 +
collapsible="true" width="200px" height="200px">
 +
<panelchildren>Panel Content</panelchildren>
 +
</panel>
 +
</tablechildren>
 +
</tablelayout>
 
</source>
 
</source>
  

Revision as of 05:53, 22 November 2010

Tablelayout

Employment/Purpose

Tablelayout lay outs a container as an HTML table whose columns can be specified, and rowspan and colspan of its child can also be specified to create complex layouts within the table.

Example

ZKComRef Tablelayout Example.PNG

<tablelayout columns="2">
	<tablechildren>
		<panel title="Table 1" border="normal" maximizable="true"
			collapsible="true" width="200px" height="200px">
			<panelchildren>Panel Content</panelchildren>
		</panel>
	</tablechildren>
	<tablechildren>
		<panel title="Table 2" border="normal" maximizable="true"
			collapsible="true" width="200px" height="200px">
			<panelchildren>Panel Content</panelchildren>
		</panel>
	</tablechildren>
	<tablechildren>
		<panel title="Table 3" border="normal" maximizable="true"
			collapsible="true" width="200px" height="200px">
			<panelchildren>Panel Content</panelchildren>
		</panel>
	</tablechildren>
	<tablechildren>
		<panel title="Table 4" border="normal" maximizable="true"
			collapsible="true" width="200px" height="200px">
			<panelchildren>Panel Content</panelchildren>
		</panel>
	</tablechildren>
</tablelayout>

Supported events

Name
Event Type
None None

Supported Children

* Tablechildren

Use cases

Version Description Example Location
     

Version History

Version Date Content
     



Last Update : 2010/11/22

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.