Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
current code sample
<center border="none">
<div visible="@load(not empty vm.otherObjects)" height="300px" >
<radiogroup id="otherObjRadioGroup" />
<portallayout id="otherObjectsPortal" children="@load(vm.otherObjects)">
<template name="children">
<portalchildren width="25%" style="padding:3px;">
<panel>
<panelchildren>
<vbox align="left" width="100%" height="25px" style="padding:2px;">
<radio id="${each}" label="@load(each)" radiogroup="otherObjRadioGroup" style="padding:3px;font-size:15px"/>
</vbox>
</panelchildren>
</panel>
</portalchildren>
</template>
</portallayout>
</div>
</center>
===============================
This is displayed horizontally now as below -
1.Airplane 2.Apple 3.Banana 4.Baseball_glove
<line break="">
5.Bear 6.Car 7.cow 8.Dog
But i want them like following - 1.Airplane 3.Banana 5.Bear 7.cow <line break=""> 2.Apple 4.Baseball_glove 6.Car 8.Dog
All you need to do is change the order in your collection "otherObjects" and the rendering will reflect that order.
This doesn't require any feature in ZK and can be done with plain java.
public void reorder(List<String> list) {
List<String> toAppend = new ArrayList<>(list.size() / 2);
Iterator<String> it = list.iterator();
int index = 0;
while(it.hasNext()) {
String item = it.next();
if(index % 2 == 1) {
it.remove();
toAppend.add(item);
}
index++;
}
otherObjects.addAll(toAppend);
}
init() {
// ... load the objects somehow
reorder(otherObjects);
}
Here a runnable version on ZK-Fiddle using the same reorder method: http://zkfiddle.org/sample/2322jsj/1-reorder-items-in-list
Since your question wasn't more specific this is just a simple solution for 8 items. It might be more interesting for you to decide what to do if there are more or less than 8 items in your list.
Asked: 2017-09-27 12:47:59 +0800
Seen: 15 times
Last updated: Sep 27 '17
Thats right. I have more items and count is dynamic. That's why i wanted to avoid this index%2 and processing part. But anyway I will give it a check. Thank you!
mpatt ( 2017-09-27 16:01:19 +0800 )editExactly what I mean... so you just need to decide on a display order and the component will follow. Unfortunately that's a decision only your code can make. Whether it's adding a new column for item 9,10 or a new row - it's up to you.
cor3000 ( 2017-09-27 16:40:28 +0800 )edit