📄 panel.zul
字号:
<?xml version="1.0" encoding="UTF-8"?><!--
panel.zul
{{IS_NOTE
Purpose:
Description:
History:
Tue Jul 1 11:50:26 TST 2008, Created by jumperchen
}}IS_NOTE
Copyright (C) 2008 Potix Corporation. All Rights Reserved.
{{IS_RIGHT
}}IS_RIGHT
--><window id="demo" apply="org.zkoss.zkdemo.userguide.DemoWindowComposer">
<html><![CDATA[
<h4>Panel</h4>
<p>This is a MSN-like demo created by Panel component.</p>
]]></html>
<separator/>
<tabbox width="100%" tabscroll="false">
<tabs>
<tab id="demoView" label="Demo"/>
<tab id="srcView" label="View Source"/>
</tabs>
<tabpanels>
<tabpanel>
<window id="view">
</window>
</tabpanel>
<tabpanel>
<panel>
<panelchildren>
<textbox id="codeView" class="code" rows="20" width="95%">
<attribute name="value"><![CDATA[<zk>
<style dynamic="true">
.cells td, .search .item td {
border-bottom: 1px solid #BFDBF5;
}
.search .cell-inner {
color: #2C559C; font: italic Tahoma, Arial, Helvetica, sans-serif;
}
</style>
<panel id="panel" framable="true" width="500px" height="400px"
title="Panel"
maximizable="true" minimizable="true" border="normal"
collapsible="true" closable="true">
<attribute name="onClose">alert("Panel is closed");</attribute>
<attribute name="onMinimize">alert("Panel is minimized");</attribute>
<toolbar>
Search:
<bandbox id="bd" autodrop="true" width="350px"
onOK="search.model = strset.getSubModel(self.value, 30);">
<bandpopup width="320px">
<panel height="215px">
<panelchildren>
<zscript>
String[] data = new String[] {
"Albert", "Bob", "Candy", "Elva", "Elva2", "Gaby", "Gavin", "Jason", "John", "Jean", "Janet", "Jamie", "Jessica", "Peter",
"Rex", "Richard", "Sam", "Sidney", "Simon", "Sky", "Tony", "Vicky", "Winnie", "Wendy", "Zera", "Zenobia" };
ListModel strset = new SimpleListModel(data);
</zscript>
<listbox class="listbox search" id="search"
model="${strset}" height="100%"
style="background:white;" oddRowSclass=""
onSelect="bd.value=self.selectedItem.label; bd.closeDropdown();" />
</panelchildren>
<toolbar>
<paging
onCreate='search.setMold("paging");search.paginal=self;search.pageSize = 10;' />
</toolbar>
</panel>
</bandpopup>
</bandbox>
</toolbar>
<panelchildren>
<columnlayout>
<columnchildren width="100%">
<panel height="260px">
<panelchildren>
<borderlayout>
<center flex="true">
<div id="viewer" style="overflow:auto;"/>
</center>
<south splittable="true" size="25%" flex="true">
<textbox id="text" multiline="true" width="98%" style="margin:0px" value="Hi, I am Jumper. (Please press the OK Button)"/>
</south>
</borderlayout>
</panelchildren>
</panel>
</columnchildren>
<columnchildren width="130px">
<panel height="260px" width="100%">
<panelchildren>
<borderlayout width="100%" style="background:transparent">
<north size="120px" border="none" style="background:transparent">
<image src="/img/msn1.gif"/>
</north>
<south size="120px" border="none" style="background:transparent">
<image src="/img/msn2.gif"/>
</south>
</borderlayout>
</panelchildren>
</panel>
</columnchildren>
</columnlayout>
</panelchildren>
<toolbar>
<menubar id="menubar" width="200px">
<menu label="Project" src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png">
<menupopup>
<menuitem src="/img/Centigrade-Widget-Icons/BriefcaseSpark-16x16.png" label="New"
onClick="alert(self.label)" />
<menuitem src="/img/Centigrade-Widget-Icons/BriefcaseOpen-16x16.png" label="Open"
onClick="alert(self.label)" />
<menuitem src="/img/Centigrade-Widget-Icons/DisketteBlack-16x16.png" label="Save"
onClick="alert(self.label)" />
<menuseparator />
<menuitem label="Exit" src="/img/Centigrade-Widget-Icons/DoorOpen-16x16.png" onClick="alert(self.label)" />
</menupopup>
</menu>
<menu label="Help" src="/img/Centigrade-Widget-Icons/QuestionmarkButton-16x16.png">
<menupopup>
<menuitem label="Index" onClick="alert(self.label)" />
<menu label="About">
<menupopup>
<menuitem label="About ZK"
onClick="alert(self.label)" />
<menuitem label="About Potix"
onClick="alert(self.label)" />
</menupopup>
</menu>
</menupopup>
</menu>
<menu src="/img/Centigrade-Widget-Icons/Spyglass-16x16.png">
<menupopup>
<menuitem label="Index" onClick="alert(self.label)" />
</menupopup>
</menu>
</menubar>
</toolbar>
<toolbar mold="panel" align="center">
<button label="OK" width="65px">
<attribute name="onClick">
if (text.value != "") {
Div div = new Div();
new Image("/img/m1.gif").setParent(div);
new Label("Jumper@office says:").setParent(div);
div.setParent(viewer);
Label content = new Label(text.value);
content.setStyle("padding-left:20px");
content.setParent(viewer);
text.value = "";
}
</attribute>
</button>
<button label="Canel" width="65px" onClick='text.value = ""'/>
</toolbar>
</panel>
</zk>
]]></attribute>
</textbox>
</panelchildren>
<toolbar mold="panel">
<button id="tryBtn" label="Try me!"/>
<button id="reloadBtn" label="Reload" height="18px"/>
</toolbar>
</panel>
</tabpanel>
</tabpanels>
</tabbox>
</window>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -