Processing...
Description & Source Code

Timer is an invisible component. It fires one or more org.zkoss.zk.ui.event.Event after a specified delay. Notice that the timer won't fire any event until it is attached to a page.

timer.zul
<zk>
	<style>.count { font-weight: bold; font-size: 16px; } .time { font-size: 16px; }</style>
	<zscript>
	int countNum = 10;
	void restart() {
		countNum = 10;
		pm.value = 0;
		timer.start();
	}
</zscript>
	<groupbox mold="3d" closable="false">
		<caption label="Timer Demo">

		</caption>
		<vlayout spacing="30px">
			<label id="now" sclass="time" />
			<label id="count" sclass="count" />
			<progressmeter id="pm" value="0" width="300px" />
			<hlayout>
				<button label="Start" onClick="timer.start()" width="80px" />
				<button label="Stop" onClick="timer.stop()" width="80px" />
				<button label="Restart" onClick="restart()" width="80px" />
			</hlayout>
		</vlayout>
	</groupbox>
	<timer id="timer" delay="1000" repeats="true">
		<attribute name="onTimer">
	now.setValue("Time :" + new Date().toString());
	if (countNum == 0) {
		timer.stop();
		return;
	}
	count.value = "Count : " + --countNum + "";
	pm.value = pm.value + 10;
</attribute>
	</timer>
</zk>