A listbox differs from a regular grid in its support for item selection, possible also using keystroke commands. In this demo, the email inbox is built using listbox and the select box at the top left corner is implemented using a listbox in "select" mold.

Keystroke commands include:

UP and DOWN - move traverse items in list.

PgUp and PgDn - go to the next page if there is any, jumps to the beginning or end of a page when there is only one page.

HOME - go to the first item

END - go to the the last item.

Ctrl+UP and Ctrl+DOWN - traverse upwards or downwards in the listbox without changing the selection.

SPACE - selects the item currently in focus.

<zk>
	<zscript><![CDATA[
ListModelList model = new ListModelList();
model.add("Inbox");
model.add("Received");
model.add("Draft");
	]]></zscript>
	<hlayout>
		<selectbox selectedIndex="0" model="${model}" />
		<textbox id="txt" width="220px" style="color:#008FD2;" />
	</hlayout>
	<separator bar="true" />
	<listbox>
		<attribute name="onSelect"><![CDATA[
			txt.setValue("Mail Received on "+
					self.getSelectedItem().getLastChild().getLabel());	
		]]></attribute>
		<listhead sizable="true">
			<listheader align="center" width="40px"
				image="/widgets/listbox/keystroke_command/img/ArrowsUpDown-16x16.png" />
			<listheader align="center" width="40px" 
				image="/widgets/listbox/keystroke_command/img/Envelope-16x16.png" />
			<listheader align="center" width="40px"
				image="/widgets/listbox/keystroke_command/img/PaperClip-16x16.png" />
			<listheader label="Subject" sort="auto"/>
			<listheader label="Received" sort="auto"/>
		</listhead>
		<listitem height="28px">
			<listcell image="/widgets/listbox/keystroke_command/img/ArrowUpOrange-16x16.png" />
			<listcell image="/widgets/listbox/keystroke_command/img/EnvelopeOpen-16x16.png" />
			<listcell image="/widgets/listbox/keystroke_command/img/PaperClip-16x16.png" />
			<listcell label="ZK 5.0.3 Released!" />
			<listcell label="2010/06/29 17:41:29" />
		</listitem>
		<listitem height="28px">
			<listcell image="/widgets/listbox/keystroke_command/img/ArrowDown-16x16.png" />
			<listcell image="/widgets/listbox/keystroke_command/img/Envelope-16x16.png" />
			<listcell image="/widgets/listbox/keystroke_command/img/PaperClip-16x16.png" />
			<listcell label="ZK 5.0.2 Released!" />
			<listcell label="2010/05/12 15:56:37" />
		</listitem>
		<listitem height="28px">
			<listcell image="/widgets/listbox/keystroke_command/img/ArrowUpOrange-16x16.png" />
			<listcell image="/widgets/listbox/keystroke_command/img/EnvelopeOpen-16x16.png" />
			<listcell label="&#160;" />
			<listcell label="ZK 5 Released!" />
			<listcell label="2010/01/26 13:23:07" />
		</listitem>
		<listitem height="28px">
			<listcell image="/widgets/listbox/keystroke_command/img/ArrowUpOrange-16x16.png" />
			<listcell image="/widgets/listbox/keystroke_command/img/EnvelopeOpen-16x16.png" />
			<listcell label="&#160;" />
			<listcell label="ZK 3.6.3 Released!" />
			<listcell label="2009/11/03 10:26:37" />
		</listitem>
	</listbox>
</zk>