slider.zul

来自「ZK是一个Ajax Java Web框架」· ZUL 代码 · 共 94 行

ZUL
94
字号
<?xml version="1.0" encoding="UTF-8"?><!--image.zul{{IS_NOTE        Purpose:        Description:        History:                Thu Nov 13 16:07:16 TST 2008, Created by Flyworld}}IS_NOTECopyright (C) 2008 Potix Corporation. All Rights Reserved.{{IS_RIGHT}}IS_RIGHT--><window id="demo" apply="org.zkoss.zkdemo.userguide.DemoWindowComposer">	<html><![CDATA[		<h4>Sliders</h4>		<p>A control that enables the user to set a value in a certain range</p>		<p>Slide and see changes to the image size.</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>	<hbox>		<vbox>			<groupbox mold="3d" width="250px">				<caption label="Default" />				<slider id="slider1" onScroll="zoom(slider1, img1)" />				<image id="img1" src="/img/sun.jpg" width="10px" />			</groupbox>			<groupbox mold="3d" width="250px">				<caption label="Scale" />				<slider id="slider3" onScroll="zoom(slider3, img3)"					mold="scale" />				<image id="img3" src="/img/sun.jpg" width="10px" />			</groupbox>		</vbox>		<groupbox mold="3d" width="280px">			<caption label="Sphere slider:" />			<slider id="slider21"				onScroll="zoom(slider21, img2);syncs(-1)" mold="sphere" />			<hbox width="250px">				<hbox width="225px">					<image id="img2" src="/img/sun.jpg" width="10px" />				</hbox>				<slider id="slider22"					onScroll="zoom(slider22, img2);syncs(1)" mold="sphere"					orient="vertical" />			</hbox>		</groupbox>	</hbox>	<zscript>	void syncs(int slid ){		(slid > 0 ? slider21.setCurpos(slider22.getCurpos()):		slider22.setCurpos(slider21.getCurpos()));	}	void zoom(Slider slider, Image img) {		int v = slider.getCurpos();		int w = v*1.5 > 10 ? v*1.5 :10;		img.setWidth(w + "px");	}	</zscript></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 + =
减小字号Ctrl + -
显示快捷键?