Question

I’m fighting with this one for quite some time now.
I have my TreeitemRenderer as follows:

public class PermissionTreeRenderer implements TreeitemRenderer<PermissionTreeNode> {

    @Override
    public void render(final Treeitem treeItem, PermissionTreeNode node, int arg) throws Exception {
        final PermissionTreeNode ptn = (PermissionTreeNode)node;
        Treerow treeRow = new Treerow();

        treeItem.setOpen(ptn.isOpen());
        treeItem.appendChild(treeRow);
        PermissionItem current = (PermissionItem) ptn.getData();
        treeRow.appendChild(new Treecell(current.getName()));

    }
}

My BasicComposer (extending GenericForwardComposer) has both the attributes

private PermissionTreeModel treeModel;
private TreeitemRenderer treeitemRenderer = new PermissionTreeRenderer();

with getters and setters.

In my .zul my tree looks like this:

<tree id="permissionTree" width="100%"
    model="@{win$composer.treeModel}"
    treeitemRenderer="@{win$composer.treeitemRenderer}">
    <treecols>
        <treecol label="Item" width="400px" />
        <treecol label="Wert" />
    </treecols>
</tree>

What I’ve seen by testing so far is that he loads the model (he steps into the getter), but not the treeitemRenderer. the render-method isn’t called, no matter what I do.

Edit: My problem was that I only filled the root node (for testing) and it needs at least one child item to draw…

Well @dennis: I will try to use the new way like you said, so here’s my code:

<tree id="permissionTree" width="100%"
    model="@bind(vm.treeModel)" style="text-align:left;">
    <treecols>
        <treecol label="Item" width="400px" />
        <treecol label="Wert" />
        <treecol label="Einfügen" width="100px" />
    </treecols>
    <template name="model" var="node" status="s">
        <treeitem open="@bind(node.open)">
            <treerow>
                <treecell label="@bind(s.index)" />
                <treecell label="@bind(node.data)" />
                <treecell>
                    <hbox>
                        <button label="Index"
                            onClick="@command('showIndex', index=s.index)" />
                        <button label="Delete"
                            onClick="@command('delete', node=node)" />
                        <button label="Add After"
                            onClick="@command('addAfter', node=node)" />
                        <button label="Add Before"
                            onClick="@command('addBefore', node=node)" />
                    </hbox>
                </treecell>
            </treerow>
        </treeitem>
    </template>
</tree>

But it just won’t fill my tree with data anymore. Oh and, what’s that status s variable? Do I have to make preparations in any other file?

Edit: Problem solved, had to apply org.zkoss.bind.BindComposer

Thanks guys!

Answer 1

If you are using ZK 6, you could use new bind mechanism which is easier than it in ZK 5 and you don’t need to write a renderer. here is the code snippet shows the look https://github.com/zkoss/zk/blob/master/zktest/src/archive/bind/basic/collection-index-tree.zul