I have a UltraTree with Nodes, where i want a UltraComboEditor beside. My Node now has a Checkbox, a Image and a Text.
Beside the Text should be a ComboEditor.
You can see how the tree should look like in the next picture.
UltraTreeNode node = new UltraTreeNode(); node.Override.NodeStyle = NodeStyle.CheckBox; node.LeftImages.Add(element.Image); node.Text = element.Text;
node.Override.EditorComponent = new MyCustomControl();
Hi,
There are a few different ways you might go about achieving this. But you can't really do it with a single ViewStyle.Standard node.
One hurdle is that a ViewStyle.Standard node doesn't have any way to store a third piece of information. The UltraTreeNode has a CheckState property to store the state of the built-in checkbox and it has a Text property to store the text. But there's no third property to store the value of a ComboEditor. Attaching an UltraComboEditor to the node edits the node's Text.
So the simplest way I can see to get around this would be to make your child nodes show in ViewStyle.Grid. That way you could have a column for the checkbox, one for the image, one for the text and one for the combo. How you do that depends on the structure of your tree, but from the screenshots here, it looks like you have a pretty simple structure with only two levels. So if that's the case and your second level is always going to be child nodes, you could create a ColumnSet and apply it to the tree's NodeLevelOverrides for the second level.
I attached a small sample project here to demonstrate the basics.
WindowsFormsApplication19.zip
Hi Mike,
thanks for the answer. I doing well with your sample but still have some problems and questions.
- how can i hide the border around the grid/columns? I only want checkbox, image, text, combo, with no border around. I tried the following two lines, but with no success.
tree.BorderStyle = UIElementBorderStyle.None;
tree.ShowRootLines = false;
- How can i hide some columns in special rows?
As you can see in the picture, i only want to see the green comboColumn, but hide all red parts of the picture.
- I have problems to display my image in the imageColumn. i use a ImageList and what to set the image with its ImageList Name in the Column.
- The click on the Checkbox is not responding. which event/setting do i need?
Jochen Rosenthaler said:- how can i hide the border around the grid/columns? I only want checkbox, image, text, combo, with no border around. I tried the following two lines, but with no success.
That's pretty easy:
this.ultraTree1.ColumnSettings.BorderStyleCell = UIElementBorderStyle.None;
Jochen Rosenthaler said:- How can i hide some columns in special rows?
This is a little trickier.
The parent nodes in my sample already do what you want.
But basically what you are describing here is a FreeForm tree where different nodes in the same collection have different columns. So the way you have to do this is to create two ColumnSets: One that has the Combo column and one that does not. Then what you do is assign the one without the combo column to the NodeLevelOverrides.Then you assign a different ColumnSet (with the Combo) to the one node that you want to have it. Of course, if there is more than one node, then you can assign that ColumnSet to each node where you want the combo.
So you need to make a bunch of changes to the code.
1) Set the tree's ViewStyle to FreeForm instead of Grid. Grid assumes that the ColumnSets for every node in the collection are the same.
2) Create two ColumnSets - one with the Combo column and one without. I suggest re-factoring the creation of the ColumnSet into a method so you can optionally add the combo column.
3) Set NodeLevelOverrides[1].ColumnSet to the ColumnSet without the Combo column.
4) When you add the nodes to the tree, you don't have to do anything different, except for the node(s) that you want to have the combo. For those nodes, you set the node.Override.ColumnSet to the ColumnSet WITH the Combo. The ColumnSet applied to the individual node will override the one on the NodeLevelOverride. Of course, this means you also don't set the value (SetCellValue) of the ComboBox column on the nodes that don't have it.
5) In my sample, I have a loop that does an PerformAutoResize on each column in the ColumnSet. You will probably want to do this for BOTH columnsets - 2 loops.
Jochen Rosenthaler said:- I have problems to display my image in the imageColumn. i use a ImageList and what to set the image with its ImageList Name in the Column.
Since the image is now the Value of a cell, and not an appearance on the node, you can't use an ImageList index or key. You have to assign an Image to the cell's value for each node. You could, of course, get the image from the ImageList. But you have to give the cell an image, not an index/key.
var childNodeImage = this.imageList1.Images["Child Image"];
Jochen Rosenthaler said:- The click on the Checkbox is not responding. which event/setting do i need?
Ah, sorry about that. I didn't notice. If you look at my code where I created the Combo column, in order to make it editable, I had to do this:
comboColumn.AllowCellEdit = AllowCellEdit.Full;
So you need to do the same thing for the CheckBox column.
checkBoxColumn.AllowCellEdit = AllowCellEdit.Full;
I am attaching an updated version of my sample for your reference.
5100.WindowsFormsApplication19.zip
thanks for your answer and the excellent sample and explanation.
I could nearly finish my code, but i have two last questions.
thanks in advance
Jochen Rosenthaler said:In my ComboBox i see the values of the ValueList properly. But unfortunately I'm able to write something in the combo by myself to an existing entry. I use comboColumn.AllowCellEdit = AllowCellEdit.Full; - if i use comboColumn.AllowCellEdit = AllowCellEdit.ReadOnly; - than i can not dropdown the comboBox and choose different values.
Just to clarify... what exactly do you want here? Are you saying you want the user to be able to drop down the list and see it, but not choose an item? Or are you saying they can choose an item from the list, but you don't want them to be able to type into the cell?I'm not sure if the former is possible, but I believe the latter is. The wasiest way is to create an UltraComboEditor control and set it to DropDownList and apply it to the column. It sounds like you are already doing that, anyway.
if (includeComboColumn) { var comboColumn = columnSet.Columns.Add("Combo"); comboColumn.DataType = typeof(int); UltraComboEditor ultraComboEditor = new UltraComboEditor(); ultraComboEditor.DropDownStyle = DropDownStyle.DropDownList; this.Controls.Add(ultraComboEditor); comboColumn.EditorComponent = ultraComboEditor; var valueList = new ValueList(); valueList.ValueListItems.Add(0, "Apple"); valueList.ValueListItems.Add(1, "Banana"); valueList.ValueListItems.Add(2, "Cherry"); valueList.ValueListItems.Add(3, "Grape"); valueList.ValueListItems.Add(4, "Watermelon"); comboColumn.ValueList = valueList; comboColumn.AllowCellEdit = AllowCellEdit.Full; }
your solution works fine, thats exactly what we want.
Thanks for following up with your progress! Glad we could help. :)