0

Stretchable Tree?

asked 2009-02-25 21:23:29 +0800

sparqle gravatar image sparqle
15

How can I make the following tree stretch, so that if a user pulled the bottom border of the tree down, the tree expands to display more rows of data? By default, the tree should show only 8 rows of data. Can this be done in ZK?
-----------------------------------------------------------------------------------------------------------
<hbox width="100%">
<vbox>
Four style of trees :
<radiogroup
onCheck='tree.setZclass("z-"+self.selectedItem.value)'>
<vbox>
<radio label="Default" value="tree" selected="true"/>
<radio label="Dot Tree" value="dottree" />
<radio label="XP Explorer" value="filetree" />
<radio label="Vista Explorer" value="vfiletree" />
</vbox>
</radiogroup>
</vbox>
<tree id="tree" width="400px" rows="8">
<treecols sizable="true">
<treecol label="Name" />
<treecol label="Description" />
</treecols>
<treechildren>
<treeitem>
<treerow>
<treecell label="Item 1" />
<treecell label="Item 1 description" />
</treerow>
</treeitem>
<treeitem>
<treerow>
<treecell label="Item 2" />
<treecell label="Item 2 description" />
</treerow>
<treechildren>
<treeitem>
<treerow>
<treecell label="Item 2.1" />
</treerow>
<treechildren>
<treeitem>
<treerow>
<treecell label="Item 2.1.1" />
</treerow>
</treeitem>
<treeitem>
<treerow>
<treecell label="Item 2.1.2" />
</treerow>
</treeitem>
</treechildren>
</treeitem>
<treeitem>
<treerow>
<treecell label="Item 2.2" />
<treecell
label="Item 2.2 is something who cares" />
</treerow>
</treeitem>
<treeitem>
<treerow>
<treecell label="Item 2.2" />
<treecell
label="Item 2.2 is something who cares" />
</treerow>
</treeitem>
<treeitem>
<treerow>
<treecell label="Item 2.2" />
<treecell
label="Item 2.2 is something who cares" />
</treerow>
</treeitem>
</treechildren>
</treeitem>
<treeitem label="Item 3" />
</treechildren>
</tree>
</hbox>

delete flag offensive retag edit

4 Replies

Sort by ยป oldest newest

answered 2009-02-26 01:53:48 +0800

windperson gravatar image windperson
415 1

Hi sparqle,
Change the

<tree id="tree" width="400px" rows="8">

to
<tree id="tree" width="400px" rows="10">

will let that tree show 10 rows of data per page.

link publish delete flag offensive edit

answered 2009-02-26 03:24:00 +0800

sparqle gravatar image sparqle
15

My question really was if I had say a tree with 30 items, and I do not always want to show all 30 items as it may take too much space for most users' preferences. However, if it was possible to stretch the tree dynamically to display more rows, it would be nice. So by default I want to display only 8 rows. But I want to display more rows if the user tries to stretch the tree by pulling the bottom of the tree. Wondering whether the vflex property is meant for this purpose?

link publish delete flag offensive edit

answered 2009-02-27 01:10:21 +0800

windperson gravatar image windperson
415 1

Hi sparqle,
Do you want the effect like this?
http://www.zkoss.org/zkdemo/userguide/#g12

link publish delete flag offensive edit

answered 2009-02-27 01:17:51 +0800

PeterKuo gravatar image PeterKuo
481 2

vflex is not for this.

You may put tree inside borderlayout.
Detect the height of such region in borderlayout in event listener,
and change rows property of tree accordingly.

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2009-02-25 21:23:29 +0800

Seen: 169 times

Last updated: Feb 27 '09

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More