Columnlayout"

From Documentation
m
Line 92: Line 92:
 
! <center>Event Type</center>
 
! <center>Event Type</center>
 
|-
 
|-
| NONE
+
| None
| NONE
+
| None
 
|}
 
|}
  
Line 105: Line 105:
 
! Version !! Description !! Example Location
 
! Version !! Description !! Example Location
 
|-
 
|-
| 5.0+
+
| &nbsp;
 
| &nbsp;
 
| &nbsp;
 
| &nbsp;
 
| &nbsp;
Line 115: Line 115:
 
! Version !! Date !! Content
 
! Version !! Date !! Content
 
|-
 
|-
| 5.0.1
+
| 5.0.2
 
| 04/30/2010
 
| 04/30/2010
 
| Initialization
 
| Initialization

Revision as of 03:17, 14 May 2010

Columnlayout

Employment/Purpose

A columnlayout lays out a container which can have multiple columns, and each column may contain one or more panel.Use Columnlayout need assign width (either percent or pixel) on every Columnchildren, or we cannot make sure about layout look.

Example

ZKComRef Columnlayout Example.png

<columnlayout>
	<columnchildren width="30%" style="padding: 5px">
		<panel height="100px" style="margin-bottom:10p title=" column1-1 "
			border="normal" maximizable="true" collapsible="true">
			<panelchildren>Panel</panelchildren>
		</panel>
		<panel height="100px" framable="true" title="column1- border="
			normal " maximizable="true" style="margin-bottom:10px">
			<panelchildren>Panel</panelchildren>
		</panel>
		<panel height="100px" title="column1-3" border="normal"
			closable="true">
			<panelchildren>Panel</panelchildren>
		</panel>
	</columnchildren>
	<columnchildren width="40%" style="padding: 10px">
		<panel title="Data" maximizable="true" border="normal"
			style="margin-bottom:10px">
			<panelchildren>
				<grid fixedLayout="true" style="border:0px" height="100%">
					<columns>
						<column label="category" />
						<column label="value" />
					</columns>
					<rows>
						<row>
							<label id="c0" value="C/C++" />
							<decimalbox id="v0" value="21. constraint=" no empty "
								onChange="update(0)" />
						</row>
						<row>
							<label id="c1" value="VB" />
							<decimalbox id="v1" value="10. constraint=" no empty "
								onChange="update(1)" />
						</row>
						<row>
							<label id="c2" value="Java" />
							<decimalbox id="v2" value="40. constraint=" no empty "
								onChange="update(2)" />
						</row>
						<row>
							<label id="c3" value="PHP" />
							<decimalbox id="v3" value="28. constraint=" no empty "
								onChange="update(3)" />
						</row>
					</rows>
				</grid>
			</panelchildren>
		</panel>
		<panel border="normal">
			<panelchildren>
				<checkbox label="3D Chart" checked="true"
					onCheck="mychart.setThreeD(self.isChecked())" />
				<chart id="mychart" title="Pie Chart Demo" width="320p type="
					pie " threeD="true" fgAlpha="128">
					<attribute name="onClick"> String areaid = event.getArea(); if
						(areaid!= null) { Area area = self.getFellow(areaid);
						alert(""+area.getAttribute("entity")+":"+area.getTooltiptext()); }
					</attribute>
					<zscript> void update(int rowIndex) { Label lb = (Label)
						self.getFellow("c"+rowIndex); Decimalbox db =
						(Decimalbox)self.getFellow("v"+rowIndex); model.setValue(lb.value,
						newDouble(db.getValue().doubleValue())); } PieModel model = new
						SimplePieModel(); for(int j=0; j &lt; 4; ++j) { update(j); }
                             mychart.setModel(model);
                         </zscript>
                 </chart>
             </panelchildren>
         </panel>
     </columnchildren>
 </columnlayout>

Supported events

Name
Event Type
None None

Supported Children

Columnchildren

Use cases

Version Description Example Location
     

Version History

Version Date Content
5.0.2 04/30/2010 Initialization



Last Update : 2010/05/14

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