Tags
People
Badges
Help
Thanks, that is what I want to achieve, although Im using the MVC pattern. I guess I'll switch to MVVM, it seems simpler that way.
gsanmartin ( 2014-07-02 18:44:51 +0800 )edit-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
I am trying to optimize the performance on my Grid by setting a model instead of using a forEach (according to the docs it's faster that way). The problem is using
<grid>
<rows>
<template>
</template>
</rows>
</grid>
Sets each element in the listmodel as a row (as expected), but given this is a grid (like a table, with rows and cols), I don't know how to represent column elements contained within my ListModel Objects. I have used a custom RowRenderer that goes through each row and then creates each Cell programmatically, setting styles also programmatically, but I feel this is an awkward way and I would like to benefit of using declarative ZUL files and set styles a-la HTML instead of programmatically.
How would you bind a model to a grid to achieve such behavior?
I have prepared a small MVVM solution. You may find the whole code here.
As you can see in the zul below i am using a template inside a template. It is really simple and fast:
<?page contentType="text/html;charset=UTF-8"?>
<zk>
<window title="Workers" border="normal" width="100%" height="100%"
apply="org.zkoss.bind.BindComposer"
viewModel="@id('vm') @init('snippets.workers.WorkersVM')"
xmlns:n="native">
<hlayout>
<separator width="200px"></separator>
<hlayout children="@load(vm.monthDays)">
<template name="children" var="day">
<textbox value="@load(day)" readonly="true"
inplace="true" width="20px" />
<separator width="2px" />
</template>
</hlayout>
</hlayout>
<grid model="@load(vm.workers)">
<template name="model" var="worker" status="record">
<row>
<cell width="50px">
<label value="@load(record.index)" />
</cell>
<cell width="150px">
<label value="@load(worker.name)" />
</cell>
<cell>
<hlayout children="@load(worker.workdays)">
<template name="children" var="workday">
<textbox value="@load(workday.type)" readonly="true"
inplace="true" width="20px" />
<separator width="2px" />
</template>
</hlayout>
</cell>
</row>
</template>
</grid>
</window>
</zk>
If you run this you should see something like this:
Hope that helps
Costas
Thanks, that is what I want to achieve, although Im using the MVC pattern. I guess I'll switch to MVVM, it seems simpler that way.
gsanmartin ( 2014-07-02 18:44:51 +0800 )editSame here, did see big problem of performance on grid. I did approach by putting all as static and not using RowRenderer... How your performances changed ? In my case, I did pass to 5 sec loading to less 0.5 sec for a grid 81*27 but 25k lines of code of getter/setter...
About the same, I switched to model & rowrenderer and now it works smoothly
gsanmartin ( 2014-06-27 10:53:16 +0800 )editHow did you do i? the problem here is that each row has 31 columns for me, so I have to fill up those columns manually via Java on the RowRenderer... Can you point me to a better solution?
gsanmartin ( 2014-06-27 11:04:05 +0800 )edituse paging!
@gsanmartin How many rows do you will create/load?
around 30 rows & 31 columns. I can't use paging, it's a calendar we're talking about here
gsanmartin ( 2014-06-27 10:44:58 +0800 )editanyway my question was as to how to set RowRenderer to render from a zul or something instead of having to set CSS properties, events and such through Java codes
gsanmartin ( 2014-06-27 10:57:11 +0800 )editUsing the iterative renderer maybe?
That would be a perfect solution -- problem is, I have a variable number of objects to be shown in columns (i.e. an ArrayList) so I need to iterate from inside the <template> bit. Do you know if this is possible?
gsanmartin ( 2014-06-27 16:26:57 +0800 )editYou mean you need to render a collection of objects indside each column? Then maybe you may use a "children" template inside the grid's template. Can you provide a data sample?
cyiannoulis ( 2014-06-27 19:55:31 +0800 )editcan you embed a template within a template?
I can't provide real data right now, but here's a quick sample that's similar to the data I want to represent: http://pastebin.com/7JNbcXYF Basically it's a month plan where you assign your workers to work shifts.
gsanmartin ( 2014-06-27 22:21:51 +0800 )editSo I'll have my Workers list object where I store my Worker objects (this is the object I bind to the grid and the template tag), and whithin these Worker objects there's a list of Activity objects storing the shifts for that worker on each particular day.
gsanmartin ( 2014-06-27 22:24:30 +0800 )editAsked: 2014-06-25 15:54:18 +0800
Seen: 38 times
Last updated: Jul 02 '14
