Dark and Drop
Source :
<?xml version="1.0" encoding="UTF-8"?>
<zk>
Drag project to other list or same list for reorder
<hbox>
<listbox id="left" height="250px" width="200px" onDrop="move(event.dragged)" droppable="true"
oddRowSclass="non-odd">
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK Forge" />
</listitem>
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK Mobile" />
</listitem>
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK GWT" />
</listitem>
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK JSF" />
</listitem>
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK JSP" />
</listitem>
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK Spring" />
</listitem>
</listbox>
<separator />
<listbox id="right" height="250px" width="200px"
oddRowSclass="non-odd" onDrop="move(event.dragged)" droppable="true"
multiple="true" >
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK" />
</listitem>
<listitem draggable="true" droppable="true" onDrop="move(event.dragged)">
<listcell src="/img/Centigrade-Widget-Icons/Briefcase-16x16.png" label="ZK Studio" />
</listitem>
</listbox>
</hbox>
<zscript>
void move(Component dragged) {
if (self instanceof Listitem) {
if (dragged.getParent().getId().equals("right")) {
self.parent.insertBefore(dragged, self.getNextSibling());
} else {
self.parent.insertBefore(dragged, self.getNextSibling());
}
} else {
self.appendChild(dragged);
}
}
</zscript>
</zk>
Hasil :
