New TreeView API

Unity Engine
,
1

In the just released 5.6 beta 2 we have included new API for creating TreeViews in the Editor. It is a powerful feature that we use throughout Unity’s own tools and we believe it will be useful for those of you that are building Editor extensions for the Asset Store or for your in-house tooling.

The TreeView API is somewhat different from our ‘traditional’ IMGUI controls which mainly are static method calls. The TreeView is a control you allocate an instance of up front and that can have internal state (selection, expanded items etc).

To help you get started we have included links below to the Manual draft and to a Unity project which has several examples of how to use the TreeView; from simple tree views to more complex multi-column tables. When opening that project the main menu will have a ‘TreeView Examples’ menu where the windows can be opened from.

Regarding our HTML documentation for the TreeView: our documentation tool does not currently include protected classes/structs nor protected properties in the HTML. This is being worked on. For the time being use the API Documentation links below which includes these protected properties and classes.

Links:
TreeView Examples project: here
TreeView Manual: here
TreeView API Documentation: here
MultiColumnHeader API Documentation: here

7 Likes
2

The manual link seems to be requesting access on gdocs…

3

Manual link fixed

1 Like
4

Nice, can we expect the future to entail more of things like this?

5

Yes indeed. In the 5.6 we are also exposing the BoxBoundsHandle, SphereBoundsHandle and CapsuleBoundsHandle that can be used in the SceneView. They are also placed in the UnityEditor.IMGUI.Controls namespace. More controls will be exposed in this namespace in the future.

3 Likes
6

Awesome! Will be a big help. I assume it’s in C++ and we have no chance of getting it open source?

7

Is almost all C#. Right now there’s no plans specifically to make this open source. In general we’d like to make this happen, but first step right now is to clean up our legacy controls. But I’ll poke the team to let them know there’s interest in seeing the source be made available.

3 Likes
8

The example doesn’t work
I tried the example that was linked in the first post and it’s not working in b10, a few things with Searchfield, do you have any updated example?

Assets/Editor/TreeViewExamples/BackendData/MyTreeAssetEditor.cs(13,3): error CS0246: The type or namespace name `SearchField’ could not be found. Are you missing an assembly reference?
in 5.6b4

9

I have updated the examples link. Try downloading the examples project again.
The SearchField is coming in beta11, I pulled the trigger too early.

10

Wow that’s pretty awesome how much it does with that little code. It makes the editing of an entity database very easy and icing on the cake: it even handle OS gesture rename!

Search field widget does work and I’m using b10, what’s the difference with SearchField?

I see that “collapse all” and “expand all” are instant, whereas Clicking on an arrow goes through a transition animation, Looking at the code, treeView.CollapseAll() has no parameter and the TreeView class doesn’t give any control over transition animation. Is there some API stuff missing, the transition is hard coded I guess?

11

You are probably using the SearchField static method that was included in the examples project? In beta11 I have added a builtin public SearchField class (in the IMGUI.Controls namespace) that has extended functionality: Cmd/Ctrl+F gives keyfocus to the SearchField and while typing in the search field the Arrow down key event will fire a callback that can give key-focus to other controls (e.g the TreeView). Try the new Examples project after b10.

The transition animation cannot be changed from API to ensure consistency between all TreeViews in Unity.

12

All good in 5.6f1, very clean how you added added .downOrUpArrowKeyPressed

That’s a shame you guys roll out such a great API and always end up ignoring users that don’t want bells and whistle - kind of arrogant.

13

The UX team is discussing how we should add more flexibility in configuring the UI in Unity in the future. Until we have that solution use the following API.

To disable animation globally for all TreeViews call (only needed to be called once):

EditorPrefs.SetBool("TreeViewExpansionAnimation", false);

or drop the following c# script into your project and select the menuitem: TreeViewUtility/Toggle Animation

using UnityEditor;
using UnityEditorInternal;
using UnityEngine;

static class TreeViewUtils
{
    [MenuItem("TreeViewUtility/Toggle Animation")]
    static void ToggleAnimation()
    {
        const string prefKey = "TreeViewExpansionAnimation";
        bool newValue = !EditorPrefs.GetBool(prefKey, true);
        EditorPrefs.SetBool(prefKey, newValue);
        InternalEditorUtility.RequestScriptReload();
        Debug.Log("TreeView animation is now " + (newValue ? "enabled" : "disabled"));
    }
}
3 Likes
14

I haven’t seen the UX team adding customization since the backlash of the color picker and that was around 3.0 !
It makes a huge difference so thank you.

I’ve never seen this EditorPrefs, is this new?
Is there a similar keyword for switching off the zoom animation?

15

What do you mean by ‘the zoom animation’?

16

When pressing ‘f’ the camera animates to frame the selection.

17

Ah in the SceneView. We call that ‘Frame Selected’ as you also mention.
No option for disabling the animation for that one at the moment.

1 Like
18

@Mads-Nyholm

I’ve taken a look at the simple example from the manual in google docs.
This new tree view is a god sent!

I just have one question:
How can I make it so the user can rename elements like in the normal scene view hierarchy like this:

I found BeginRename() and EndRename() and it starts the renaming, but it’s not really like in the normal hierarchy.
Sometimes the renaming starts when anything is clicked, and I don’t get when I’d call EndRename manually…
Is there a way to easily get the same “look and feel” as the normal hierarchy editor in the scene view has?

If not, when exactly does the default hierarchy window call BeginRename and EndRename?
How exactly do its checks look to figure out when to do BeginRename()?
And how does it get work with the renamed element then? (I assume you’d just take args.label and then write that back to the linked object?, But how do know when the editting ends / is commited?)

19

Hi,
So for a TreeView you only have to override CanRename and return true for the elements that support renaming (by default renaming is disabled because CanRename returns false) AND override RenameEnded to handle the result of the rename.

Seems you missed the RenameEnded method. Basically you do not need to call BeginRename nor EndRename yourself (this is only if you want to start renaming from code). Normally you would just press F2 (Win) or Enter (OSX) when the TreeView have focus (selection is rendered blue), or click an already selected item to automatically begin a rename. Renaming ends when clicking outside or pressing Enter while renaming.

You can search for ‘RenameEnded’ in the examples project to see how I use the information there to set the backend data.

1 Like
20

Thanks for the information, that works perfectly!