Toolbar serves as a container for the toolbar buttons. A toolbar button is often used as a light weight replacement for the button component.

<zk>
	<separator/>
	<panel id="panel" title="ZK Desktop" border="normal" width="445px">
		<panelchildren id="pc">
			<image src="/widgets/menu/toolbar/img/castle.png" width="100%"/>
		</panelchildren>
		<toolbar id="tb" align="end" >
			<toolbarbutton image="/widgets/menu/toolbar/img/java.png" onClick='alert("Java")' />
			<toolbarbutton image="/widgets/menu/toolbar/img/issue.png" onClick='alert("Issue")' />
			<toolbarbutton image="/widgets/menu/toolbar/img/internet.png" onClick='alert("Internet")' />
			<toolbarbutton image="/widgets/menu/toolbar/img/volume.png" onClick='alert("Volume")' />
			<toolbarbutton label="12:55 PM" onClick='alert("Time")' />
		</toolbar>
	</panel>
</zk>

<zk>
	<radiogroup onCheck='tb.setAlign(event.target.value)'>
		<vlayout>
			<label value="Select the Toolbar Alignment:"/>
			<radio label="Start" value="start" />
			<radio label="End" value="end" checked="true"/>
		</vlayout>
	</radiogroup>
	<div sclass="demo-sep-hor"/>
	<radiogroup>
		<vlayout>
			<label value="Select the Toolbar Position:"/>
			<radio label="Top" onCheck="panel.insertBefore(tb, pc);"/>
			<radio label="Botton" checked="true" onCheck="panel.appendChild(tb)"/>
		</vlayout>
	</radiogroup>
</zk>