让我们假设我有一个zul页面,其中我有不同的组件,如文本框,插件箱,按钮等...现在我拖放组件在这里和那里现在我想保存窗口的状态,当我再次来到同一页面所有组件的相同位置都会显示..如何在ZK Framework中完成。这是演示代码
<zk xmlns:x="xhtml" xmlns:zk="zk">
<window width="100%" height="100%">
<borderlayout width="100%" height="100%">
<north border="none">
<menubar sclass="vista" height="20px">
<menuitem label="ADD" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Delete" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Refresh" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Add t0 links" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menu label="View">
<menupopup>
<menuitem label="View details"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="Edit View"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label=" Summery View"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
</menupopup>
</menu>
<menuitem label="Edit" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
</menubar>
</north>
<center border="none" sclass="sub-tab-panel">
<groupbox vflex="1" hflex="1"
contentStyle="overflow:auto" width="880px">
<separator width="25px" />
<groupbox mold="3d" width="770px" draggable="grpbox"
droppable="grpbox" onDrop="move(event.dragged)">
<caption label="Grid Demo"
sclass="group-header" />
<grid>
<rows>
<row>
<label value="Mike" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
<label value="29" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
<label value="C" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
</row>
<row>
<label value="Todd" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
<label value="21" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
<label value="B" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
</row>
<row>
<label value="Tony" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
<label value="31" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
<label value="A" draggable="row"
droppable="row" onDrop="move(event.dragged)" />
</row>
</rows>
</grid>
</groupbox>
<separator />
<groupbox mold="3d" width="770px" draggable="grpbox"
droppable="grpbox" onDrop="move(event.dragged)">
<caption
label="13 000001 000 00 BP Building Permit"
sclass="group-header" />
<vlayout width="100%">
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Type"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label
value="BP Building Permit" maxlength="30"
sclass="field-data" />
</hbox>
</hbox>
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Status"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Application"
maxlength="30" sclass="field-data" />
</hbox>
</hbox>
</hlayout>
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Sub Type"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Residential"
maxlength="30" sclass="field-data" />
</hbox>
</hbox>
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Parent ID"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="1212"
sclass="field-data" />
</hbox>
</hbox>
</hlayout>
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Work"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Demo"
sclass="field-data" maxlength="30" />
</hbox>
</hbox>
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Row ID"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="12"
sclass="field-data" />
</hbox>
</hbox>
</hlayout>
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Group"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Permit"
sclass="field-data" maxlength="30" />
</hbox>
</hbox>
</hlayout>
</vlayout>
</groupbox>
<separator />
<groupbox mold="3d" width="770px" draggable="grpbox"
droppable="grpbox" onDrop="move(event.dragged)">
<caption label="DEMO" sclass="group-header" />
<vlayout width="100%">
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Type"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label
value="BP Building Permit" maxlength="30"
sclass="field-data" />
</hbox>
</hbox>
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Status"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Application"
maxlength="30" sclass="field-data" />
</hbox>
</hbox>
</hlayout>
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Sub Type"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Residential"
maxlength="30" sclass="field-data" />
</hbox>
</hbox>
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Parent ID"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="1212"
sclass="field-data" />
</hbox>
</hbox>
</hlayout>
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Work"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Demo"
sclass="field-data" maxlength="30" />
</hbox>
</hbox>
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Row ID"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="12"
sclass="field-data" />
</hbox>
</hbox>
</hlayout>
<hlayout width="100%">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Group"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label value="Permit"
sclass="field-data" maxlength="30" />
</hbox>
</hbox>
</hlayout>
</vlayout>
</groupbox>
<separator />
<groupbox mold="3d" width="770px" draggable="grpbox"
droppable="grpbox" onDrop="move(event.dragged)">
<caption label="Primary Property"
sclass="group-header" />
<hlayout width="100%" draggable="h_td1"
droppable="h_td1" onDrop="move(event.dragged)">
<hbox draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)">
<hbox width="92px" pack="end">
<label value="Address"
sclass="field-label" />
</hbox>
<hbox align="left" width="292px">
<label
value="23 NW #1 SAMMIE'S LAND OF DREA..." maxlength="30"
sclass="field-data" />
</hbox>
</hbox>
</hlayout>
<hlayout draggable="h_td" droppable="h_td"
onDrop="move(event.dragged)" width="792px">
<hbox width="92px" pack="end">
<label value="Address"
sclass="field-label" />
</hbox>
<hbox align="left" width="692px">
<textbox rows="2" draggable="false"
style="resize:none" value="" readonly="true"
sclass="field-data" width="692px" />
</hbox>
</hlayout>
</groupbox>
<separator />
<groupbox mold="3d" width="770px" draggable="grpbox"
droppable="grpbox" onDrop="move(event.dragged)">
<caption
label="Tracking Dates and Reference Information"
sclass="group-header" />
<x:table width="100%" border="0"
cellspacing="2px" cellpadding="2px">
<x:tr height="20px">
<x:td width="77px" align="right">
<label value="In Date"
sclass="field-label" />
</x:td>
<x:td width="150px">
<label value="2013-11-07"
sclass="field-data" />
</x:td>
<x:td align="right">
<label value="Issue/Approve"
sclass="field-label" />
</x:td>
<x:td width="150px">
<label id="issueDate" value=""
sclass="field-data" />
</x:td>
<x:td align="right">
<label value="Expires"
sclass="field-label" />
</x:td>
<x:td width="150px">
<label value="" sclass="field-data" />
</x:td>
</x:tr>
<x:tr height="20px">
<x:td align="right">
<label value="Ref. No."
sclass="field-label" />
</x:td>
<x:td>
<label value="" sclass="field-data"
maxlength="20" />
</x:td>
<x:td align="right">
<label value="Issued By"
sclass="field-label" />
</x:td>
<x:td>
<label value="" sclass="field-data"
maxlength="15" />
</x:td>
<x:td align="right">
<label value="Final Date"
sclass="field-label" />
</x:td>
<x:td>
<label value="" sclass="field-data" />
</x:td>
</x:tr>
<x:tr height="20px">
<x:td align="right">
<label value="Name"
sclass="field-label" />
</x:td>
<x:td colspan="3">
<label value="" maxlength="50"
sclass="field-data" />
</x:td>
<x:td align="right">
<label value="Priority"
sclass="field-label" />
</x:td>
<x:td>
<label value="" sclass="field-data" />
</x:td>
</x:tr>
</x:table>
</groupbox>
<separator />
<groupbox mold="3d" width="770px"
style="resize:none" draggable="grpbox" droppable="grpbox"
onDrop="move(event.dragged)">
<caption label="Description"
sclass="group-header">
</caption>
<hlayout>
<textbox rows="3" hflex="1" readonly="true"
style="resize:none"
value="Update through Jooq Test Case on: Thu Nov 14 17:13:51 IST 2013"
sclass="field-data" />
</hlayout>
</groupbox>
<separator />
<groupbox mold="3d" width="770px" draggable="grpbox"
droppable="grpbox" onDrop="move(event.dragged)">
<caption label="Conditions"
sclass="group-header" />
<hlayout>
<textbox rows="3" hflex="1" readonly="true"
style="resize:none" value="" sclass="field-data" />
</hlayout>
</groupbox>
<separator />
</groupbox>
</center>
<south border="0">
<menubar id="buttonBar" width="100%" height="20px">
<menuitem label="Audit" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menu label="Copy">
<menupopup>
<menuitem label="Single Copy"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="Multiple Properties"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
</menupopup>
</menu>
<menuitem label="Create Child" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Create Violation"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="Revise" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem id="issueMenu" label="Issue/Approve"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menu label="Print">
<menupopup>
<menuitem label="Print" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Inspection Card"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="Label" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Inspection Report"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuseparator></menuseparator>
<menuitem label="Custom Report 1"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="Custom Report 2"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="Custom Report 3"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
</menupopup>
</menu>
<menu label="Email">
<menupopup>
<menuitem label="Print Output"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="File" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Document on this Folder"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
<menuitem label="Attachment on this Folder"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
</menupopup>
</menu>
<menuitem label="Re-Default" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="GIS" draggable="topmenu"
droppable="topmenu" onDrop="move(event.dragged)" />
<menuitem label="Process Activity"
draggable="topmenu" droppable="topmenu"
onDrop="move(event.dragged)" />
</menubar>
</south>
</borderlayout>
<zscript><![CDATA[
void move(Component dragged) {
self.parent.insertBefore(dragged, self);
//if (self instanceof Hlayout) {
//self.parent.insertBefore(dragged, self);
//} else {
// self.appendChild(dragged);
//}
}
]]></zscript>
</window>
</zk>
现在如何保存窗口的新闻状态?
答案 0 :(得分:2)
所有组件都是可序列化的(java.io.Serializable
)。像克隆一样,所有的孩子和后代都是连载的。如果序列化组件然后反序列化它,结果将与调用Component.clone()相同
如果要重新绘制组件的组件调用isInvalidated()
的相同状态,请保存组件。
isInvalidated
布尔isInvalidated()
返回是否需要在客户端重绘此组件。
应用程序开发人员很少需要调用此方法。
注意:
如果它不属于任何页面,它总是返回true(因为如果稍后将它附加到页面,则需要重绘)。
如果当前执行不是异步更新(因此总是需要重绘),它总是返回true。
如果其父级无效,则此组件也将重新绘制,但如果未针对此组件调用invalidate()
,则此方法返回false。