Please login or register.

Login with username, password and session length
Advanced search  

Author Topic: understanding how the treeview work on a basic level  (Read 894 times)

0 Members and 1 Guest are viewing this topic.

Terry Stroud

  • Customer
  • Newbie
  • *
  • Offline Offline
  • Posts: 20
understanding how the treeview work on a basic level
« on: December 16, 2009, 02:17:35 PM »
I have a problem understanding how the Flexible Treeview nodes, node controls, and columns interact. This is most likely because I am using a mental model of Microsoft standard tree view.

Here is what I've done....

* Using Visual Basic 2008, I've added a Flexible Treeview to a form. (named ftv_payments in this example)
* With the IDE (at Design time), i created 2 columns (used default names)
* With the IDE (at Design time), I added 2 NodeControls both text boxes one is assigned column id 0 the other is set to 1 (controls named NTB1 and NTB2)
* I added a button to the form. The idea is to press this and simply add a node and child node to prove that i understand how to populate the treeview control.


------------------------------------------------------------
Here is the code for the button click....

Code: [Select]
Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click

Dim ftvn As ARMSoft.FlexibleTreeView.Nodes.Node
Dim SubNode As ARMSoft.FlexibleTreeView.Nodes.Node


ftvn = New ARMSoft.FlexibleTreeView.Nodes.Node("12345")

SubNode = New ARMSoft.FlexibleTreeView.Nodes.Node("sub")
ftvn.Nodes.Add(SubNode)


ftv_payments.Nodes.Add(ftvn)


End Sub
-------------------------------------------------------------

What I can't seem to do is place text values into the second textbox control (i.e. second column)

I've tried all sorts of things that aren't reflected here because they failed.
* First I assumed the I would be able to create a node instance FROM the treeview via add or attach. This instance would have the controls added to it from the Design time definition.

* Then, I assumed that when the ftvn node was added to the tree the design time control would be referenced.

* now I believe that I must add nodecontrols to each node as i create them? How does the treeview maintain control "consistency" from node to node? Or am I free to create any combination of controls per node? If so, what does the Design time control creation do? Why is it there?

Thanks,

Terry

Ruslan

  • Flexible TreeView Team
  • Sr. Member
  • *****
  • Offline Offline
  • Posts: 496
Re: understanding how the treeview work on a basic level
« Reply #1 on: December 16, 2009, 03:48:41 PM »
Welcome to forums and thank you for your interest to our product!

You almost done what you need. Really, Flexible TreeView doesn`t have the standard treeview`s hierarchy because of its limitations and restrictions.
Flexible TreeView has three core parts: columns, node controls and nodes.
 * Columns are optional and they limit the data by their bounds as a grid control does. To define columns use the Columns treeview property in the VS designer.
 * Node controls intended to display in the treeview the bound data stored in nodes. Every node control is bound to one node class`s member. To define that member name, use the DataFieldName node control property. Every node control only displays a data type it supports (NodeTextBox - text, NodeImage - image and so on). Note that without node controls treeview do not display any data! Also, if you tree has columns it is mandatory to define a column where to show this node control by using the ColumnId node control property.
 * Nodes - there all your data are stored. Node is an instance of the Node or any derived class, added to the treeview. The node class should contain all the members that are stated in DataFieldName node controls` property! There`re many custom node classes built-in like NodeWithDescription, NodeWithImage, NodeWithControl and so on that you can use for your purposes without defining your own classes.

So, after this brief description let`s take a look at your code. You need to display two columns with a separate text in every column.
To do that, you need to:
 * add two columns through the VS designer what you did - Done;
 * add two NodeTextBox node controls because you need to display a text - Done.
 * tell the treeview to show every node controls in the separate column - done by assigning the ColumnId node control property.
 * [NEW] define what node`s data to display in every node control. To do that, set these members` name in the DataFieldName node control property. The NodeTextBox node control has the 'Text' default value for the DataFieldName. That is mean that the node class should have the Text property and it is actually has it. To bind the second node member to the second text node control, set NTB2.DataFieldName to the 'Description' value (see below for explanation why 'Description').
 * [NEW] the Node class has the Text property built-in but because you need the second text to display we need to create a new node class with that additional property. To do not reinvent the wheel, we`ll use the NodeWithDescription built-in class with the Description text property (that`s why we used the 'Description' for the NTB2.DataFieldName property above!).

Now the complete code:
Code: [Select]
Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click

Dim ftvn As ARMSoft.FlexibleTreeView.Nodes.NodeWithDescription
Dim SubNode As ARMSoft.FlexibleTreeView.Nodes.NodeWithDescription


ftvn = New ARMSoft.FlexibleTreeView.Nodes.NodeWithDescription("text for first column", "text for second column")
ftvn.AttachTo(ftv_payments)   ; this`s the short way for 'ftv_payments.Nodes.Add(ftvn)'

SubNode = New ARMSoft.FlexibleTreeView.Nodes.NodeWithDescription("sub text for first column", "sub text for second column")
SubNode.AttachTo(ftvn)

End Sub

That`s all.
To go dipper, you can read our Knowledge Base with a complete description of Flexible TreeView background and use cases to show you how you can use it in your applications. Also, please view our demo application, installed with Flexible TreeView with many samples of how to use Flexible TreeView in real applications.

Quote
* First I assumed the I would be able to create a node instance FROM the treeview via add or attach. This instance would have the controls added to it from the Design time definition.

No, node doesn`t contain any node control but treeview does instead.

* now I believe that I must add nodecontrols to each node as i create them? How does the treeview maintain control "consistency" from node to node? Or am I free to create any combination of controls per node? If so, what does the Design time control creation do? Why is it there?

No again. Think about node control like about a window to display a part of the node. Node controls always stored in the treeview and only there. Node only provides a data to display in these windows and it contains only that data.
Also, you can decide which node control to hide from every particular node by using the node control filtration. Read this topic for details.

If you have any other questions feel free to ask us.

Terry Stroud

  • Customer
  • Newbie
  • *
  • Offline Offline
  • Posts: 20
Re: understanding how the treeview work on a basic level
« Reply #2 on: December 16, 2009, 05:06:27 PM »
Excellent. That makes more sense. I'm playing with it now. BTW. I really like what the treeview can do. The Microsoft standard tree control is so limited, I've only been able to make use of it once or twice in all the programs I've written.

Terry

Ruslan

  • Flexible TreeView Team
  • Sr. Member
  • *****
  • Offline Offline
  • Posts: 496
Re: understanding how the treeview work on a basic level
« Reply #3 on: December 16, 2009, 05:41:40 PM »
Also, on the next week we`ll release new version with very important new features:
  • you can tell the node control to span columns like the HTML <colspan> tag. Using that feature you can reproduce the Outlook`s PreviewPane feature like on the attached image.
  • you can wrap the node control to the next level and display it under all other node controls. Using this feature you can create useful preview feature;
  • you can define for which node states to display the node control. This feature allow you to introduce useful dynamic user interface in a minute.
 

Copyright © 2006-2012 ARMSoft. All rights reserved.