Treeview with Checkboxes and other buttons

[dmogilevsky]

Hello,

I am trying to make a tree-view like the one in the example code, however I would like to add check boxes and other buttons to each element of the tree following the text/label.

In my case, I have three levels. The tree looks something like this:

-File: filename
--------Section: Solid
----------------Part: Solid_3
----------------Part: Solid_4
----------------Part: Solid_6
--------Section: Gas
----------------Part: Gas_3
----------------Part: Gas_4
----------------Part: Gas_6
--------Section: Liquid
----------------Part: Liquid_4

All levels should have the same buttons, but only file and section should have drop downs like the children in the tree view example. I am currently using the same struct for file and part, and I am making a Parts array within the Section struc. This currently is not working, I am getting lock value errors. How would I implement this correctly? Any help is greatly appreciated.

Thank you,
Daniel

Update: I have fixed the lock value errors by using pointers, and a treeview appears for me. While the file has the dropdowns containing the sections, the sections don't have drop downs, I still can't get the checkboxes to appear, and the parts are not showing up at all.

[rcoreilly]

You probably want to build on the existing TreeView and just re-write the ConfigParts* related code to add your special buttons etc to the nodes. The "Parts" for a TreeView widget should only contain the elements in a single node, whereas you can use conditional formatting code to configure your custom TreeView widget to render the different levels properly. If that doesn't work, then you'll have a different design from TreeView, and should write from scratch on top of PartsWidgetBase.

Check out the FileTreeView for an example that builds on the base TreeView -- it doesn't add any additional parts though, but shows how to add onto the existing widget.

[dmogilevsky]

What are you referring to when you say the ConfigParts* related code?

I've been able to get all the parts to appear correctly under their sections, so all levels of my treeview are working and accurate, but I'm still stuck on adding buttons.

Thanks again,
Daniel

Update: Found the ConfigParts code in action.go, but I'm unsure what changes to make

[dmogilevsky]

I've re-evaluated and decided it may be easier to change the menu that comes up upon right clicking the nodes of the TreeView rather than trying to add buttons to each node. How could I change this menu to have my own actions rather than the ones given?

[rcoreilly]

Great to hear that you got it mostly working. Node2D defines a set of ContextMenu* methods, and Widget has a CtxtMenuFunc that you can set to a function that defines the menu -- search for that to see examples in the existing code.

[dmogilevsky]

I was able to modify the contents of the context menu by manually setting TreeViewProps["CtxtMenuActive"]. My two menu items are now Set Visible and Set Invisible. In order to toggle visibility I need access to the label of the Node on the tree from which the context menu is originating, because the names on my treeview are the same as the names of the groups. How do I get the name of the node the context menu is coming from in the updtfunc parts of TreeViewProps?

[rcoreilly]

The property names are the names of the methods that will be called when those menu items are called, and the receiver on the method call will be the node widget, so from the node widget, you could just call the SetInvisible() method directly?

The updtfunc is for updating the inactive state of the menu, so if you need that, the first arg passed on that method is the node, and the second is the action -- see the code in filetree.go for example -- so you have the info there.

[dmogilevsky]

I don't think I can call SetInvisible() directly from the Node because the Nodes in the treeview aren't the things I'm trying to toggle the visibility of. My names are common throughout all of my code, so the group names I am trying to toggle and the Node names on the treeview are identical. (e.g the group name Solid_3 is both the name of a node on the treeview and is also the name of a group in the scene)

I would like to just call sc.Library[groupName].SetInvisible(), but I'm not sure how to get the name of node the context menu is originating from, when setting my props. Here is what I have so far:

giv.TreeViewProps["CtxtMenuActive"] = ki.PropSlice{ {Name: "ClearInvisible", Value: ki.Props{ "label": "Set Visible", }}, {Name: "SetInvisible", Value: ki.Props{ "label": "Set Invisible", }}, }

So essentially, I only have the labels properly configured :/

Is there a way to set the context menu anew each time I open it up from a node? If so maybe I can change it each time I right click a node so that it's node specific?

[rcoreilly]

that Name: "ClearInvisible" prop means it will call the "ClearInvisible" method -- that is operating on the TreeView item itself, and that method only clears the flag, unless you changed it. In any case, the key point is that youre naming a method to call, and in that method, you have full access to e.g., the Name() method on the TreeView that got called, and that should give you what you want, right?

[dmogilevsky]

If I were to make a Name: "Name" prop I understand it would return the name of the TreeView element that got called, but I'm not sure how to then use it in the Props context

I tried to make my own Set/Clear Invisible functions and giving them to a new TreeView struct with the Goki TreeView embedded in it.

type MyTreeView struct {
*giv.TreeView
}

func (tv *MyTreeView) mySetInvisible(sc *gi3d.Scene) {
sc.Library[Name].SetInvisible()
}

and myClearInvisible in the same fashion

I did this so I can call these functions with Name: "MyFunctionName" and toggle the scene with them. I haven't been able to figure out how to initialize this new TreeView though.

Update: I got this to work after changing the MyTreeView struct from *giv.TreeView to giv.TreeView

Thank you for the help!