b35-2075714.zul

ZK是一个Ajax Java Web框架

<!-- edited with XML Spy v4.3 U (http://www.xmlspy.com) by Robert (dada) -->
<?page id="testZul" title=" New ZUL Title" cacheable="false" 
	language="xul/html" zscriptLanguage="Java" contentType="text/html;charset=UTF-8"?>
<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit"?>
<zk xmlns="http://www.zkoss.org/2005/zul" xmlns:h="http://www.w3.org/1999/xhtml" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.zkoss.org/2005/zul/zul.xsd">
  Tabbox accordion-lite Test
<groupbox>
<vbox>
1.You shouldnt see an error saying  js/zul/tabs.js not found
<label value="2.Close and reopen tab1, tab width in tab1 shouldn't change."/>

</vbox>
</groupbox>
  <window title="Test Tabbox accordion-lite" border="normal" width="100%">
    <tabbox width="400px" mold="accordion-lite">
      <tabs>
        <tab label="Tab 1" image="/img/folder.gif" closable="true" draggable="true" droppable="true" focus="true" tooltiptext="Test ToolTip" width="100%"/>
        <tab label="Tab 2" image="/img/folder.gif" closable="true" draggable="true" droppable="true" focus="true" tooltiptext="Test ToolTip" width="100%"/>
        <tab label="Tab 3" image="/img/folder.gif" closable="true" draggable="true" droppable="true" focus="true" tooltiptext="Test ToolTip" width="100%"/>
        <tab label="Tab 4" image="/img/folder.gif" closable="true" draggable="true" droppable="true" focus="true" tooltiptext="Test ToolTip" width="100%"/>
        <tab label="Tab 5" image="/img/folder.gif" closable="true" draggable="true" droppable="true" focus="true" tooltiptext="Test ToolTip" width="100%"/>
        <tab label="Tab 6" image="/img/folder.gif" closable="true" draggable="true" droppable="true" focus="true" tooltiptext="Test ToolTip" width="100%"/>
      </tabs>
      <tabpanels>
        <tabpanel>
          <tabbox orient="vertical">
            <tabs width="20px">
              <tab label="A"/>
              <tab label="B"/>
              <tab label="C"/>
              <tab label="D"/>
              <tab label="E"/>
            </tabs>
            <tabpanels>
              <tabpanel>This is panel A</tabpanel>
              <tabpanel>This is panel B</tabpanel>
              <tabpanel>This is panel C</tabpanel>
              <tabpanel>This is panel D</tabpanel>
              <tabpanel>This is panel E</tabpanel>
            </tabpanels>
          </tabbox>
        </tabpanel>
        <tabpanel>
This is panel 2
The second panel
		</tabpanel>
        <tabpanel>
          <hbox spacing="0">
            <window border="normal">0</window>
            <vbox spacing="0">
              <hbox spacing="0">
                <window border="normal">1</window>
                <window border="normal">2</window>
                <vbox spacing="0">
                  <window border="normal">3</window>
                  <window border="normal">4</window>
                </vbox>
              </hbox>
              <hbox spacing="0">
                <vbox spacing="0">
                  <window border="normal">5</window>
                  <window border="normal">6</window>
                </vbox>
                <window border="normal">7</window>
                <window border="normal">8</window>
                <window border="normal">9</window>
              </hbox>
            </vbox>
          </hbox>
          <hbox spacing="0" width="100%" height="200px">
            <vbox spacing="0" width="100%" height="100%" heights="100px">
		Column 1-1: The left-top box. To know whether a splitter
		is collapsed, you can listen to the onOpen event.
		<splitter collapse="after"/>
		Column 1-2: You can enforce to open or collapse programming
		by calling setOpen method.
	</vbox>
            <splitter collapse="before"/>
	Column 2: Whether a splitter allows users to open or collapse
	depending on the collapse attribue.
</hbox>
        </tabpanel>
        <tabpanel>
          <vbox>
		Which kind of fruit do you want?
		<groupbox id="gb" mold="3d" width="300px">
              <caption image="/img/inet.png" label="fruits"/>
              <radiogroup onCheck="fruit.value = self.selectedItem.label">
                <radio label="Apple"/>
                <radio label="Orange"/>
                <radio label="Grape"/>
              </radiogroup>
            </groupbox>
            <hbox>You have selected :<label id="fruit"/>
            </hbox>
            <checkbox label="Use 3d groupbox" checked="true" onCheck='gb.mold=self.checked? "3d": "default"'/>
          </vbox>
        </tabpanel>
        <tabpanel>
          <grid>
            <columns sizable="true">
              <column label="Type" sortAscending="&#36;{asc}" sortDescending="&#36;{dsc}"/>
              <column label="Content"/>
            </columns>
            <rows>
              <row>
                <label value="File:"/>
                <textbox width="98%"/>
              </row>
              <row>
                <label value="Type:"/>
                <hbox>
                  <listbox rows="1" mold="select">
                    <listitem label="Java Files,(*.java)"/>
                    <listitem label="All Files,(*.*)"/>
                  </listbox>
                  <button label="Browse..."/>
                </hbox>
              </row>
              <row>
                <label value="Options:"/>
                <textbox rows="3" width="98%"/>
              </row>
            </rows>
          </grid>
        </tabpanel>
        <tabpanel>
          <vbox>
            <radiogroup>
              <radio label="Apple"/>
              <radio label="Orange"/>
              <radio label="Grape"/>
            </radiogroup>
            <separator bar="true"/>
            <checkbox label="Apple"/>
            <checkbox label="Orange"/>
            <checkbox label="Grape"/>
          </vbox>
        </tabpanel>
      </tabpanels>
    </tabbox>
  </window>
</zk>