Version

Binding WinTree to WinDataSource

In addition to the column support added to the WinTree™ with Ultimate UI for Windows Forms 2005 Volume 2, the ability to bind the control was also added. You can either bind the root nodes collection, using the DataSource and DataMember properties, or you can use the SetDataBindingMethod of a nodes collection to bind the contents of a specific node’s Nodes collection. The WinTree may be bound to an IList or IBindingList datasource and depending upon the AutoGenerateColumnSets can automatically generate UltraTreeColumnSet and UltraTreeNodeColumn objects based on the datasource.

In this topic we will look at binding the WinTree using the WinDataSource control. We will design a schema using the UltraDataSource’s designer, then take a look at how the WinTree changes when using the schema from the UltraDataSource, in the Grid ViewStyle .

  1. Create a new Windows Application and open the form in design view. Add a WinTree to the Form from the toolbox, and set its Dock property to Fill.

You will notice that by adding the WinTree to your project three references were added:

  • Infragistics.Shared.v23.2

  • Infragistics.Win.UltraWinTree.v23.2

  • Infragistics.Win.Win.v23.2

  1. Add an UltraDataSource to your project. This will add an additional reference to the project:

    • Infragistics.Win.UltraDataSource.v23.2

  1. Right click on ultraDataSource1 in the components tray, and select "UltraDataSource Designer" in the context menu. This will display a designer dialog similar to the one shown below.

windatasource designer
  1. Select "Band 0" under the "DataBands" header and then either hit F2 or go to the property grid displayed on the right side of the dialog and select the Key property, then change the key to "Customers".

windatasource designer column editor
  1. Under the "DataColumns" header, click on the add button to create columns. When you click the add button, the item is in edit mode and you may change the key of the new column. Add four columns to this band and assign them the following Keys "Last Name", "First Name", "Middle Name", and "Title".

windatasource designer datacolumn area
  1. Once you have created the four columns, click on the "Data Entry" node in the tree on the left. A grid will be displayed on the right hand side where you can create the rows of data. Enter the values using the data from the screenshot below. Then click OK to close the dialog.

windatasource designer data entry area
  1. To set this UltraDataSource schema as the data source for the WinTree, right click on the WinTree and choose "Properties". In the property grid, select the DataSource property and click the drop down arrow. Choose the UltraDataSource (e.g. ultraDataSource1) that you created. You may notice that the WinTree changes to show a single root node that represents the "Customers" band; this is referred to as a "band" node and is a special type of bound node and displays the name of the list in the underlying data source. You can click on the expansion indicator on this node to see the column structure that was created. Your tree should now look similar to the screenshot below.

showing windatasource bound to ultratree
  1. If you now select the DataMember property in the properties grid, a drop down arrow appears and you can select the band you defined in the data source (e.g. "Customers"). If you do this you will notice that the band node is removed and the grid structure appears at the root level.

showing windatasource bound to ultratree with datamember set
  1. Now that we have a basic structure, you may go back into the UltraDataSource designer and add child bands to create bound child nodes for the root customer nodes. For example, the image below was created by adding a child band named "Address" to the "Customers" band and then adding 4 columns to that new band - Address, City, State and Zip Code.

showing ultratree bound to windatasource with child band