z35-groupbox-003.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">
<vbox>
<label> Testing Groupbox basic functionality. If you can see all components in groupbox without truncation, it's good.</label>
<label> 0.Open the GroupBox by clicking the button.</label>
<label> 1.Uncheck the checkbox next to "grape" (so inner groupbox uses 2D Group Box) </label>
<label> 2.See if the groupbox is overlapped by hbox text. If so, its a bug.</label>
<label> 3.Check to see if the grid at the bottom is truncated on the right border when the outer groupbox is in 2D mold.</label>
</vbox>
  <window title="Groupbox test" width="100%">
    <groupbox id="gb3" width="100%" open="false">
      <caption image="/img/inet.png" label="Testing Group Box"/>
      <tabbox width="400px">
        <tabs>
          <tab label="Tab 1"/>
          <tab label="Tab 2"/>
        </tabs>
        <tabpanels>
          <tabpanel>This is panel 1</tabpanel>
          <tabpanel>This is panel 2 The second panel</tabpanel>
        </tabpanels>
      </tabbox>
      <vbox>TestVbox.</vbox>
      <tabbox width="400px" mold="accordion">
        <tabs>
          <tab label="Tab 1"/>
          <tab label="Tab 2"/>
        </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>
        </tabpanels>
      </tabbox>
      <vbox>
        <hbox>
		Testing Complicated Groupbox
		<groupbox id="gb" mold="3d">
            <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"'/>
        </hbox>
      </vbox>
      <vbox>
      <grid>
		<columns sizable="true">
			<column label="Type"/>
			<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>
      </vbox>
    </groupbox>
    <button label="Open or Close GroupBox" onClick="gb3.setOpen(!gb3.isOpen());"/>
    <checkbox label="Use 3d groupbox" checked="false" onCheck='gb3.mold=self.checked? "3d": "default"'/>
  </window>
</zk>