UIElements custom property drawers?

As far as I can tell these are nonfunctional right now.

Is this actually the case or am I missing something?
Is there an expected time when these will work?

(I tested the example project in 2019.2.5 as well as 2019.3.0b3, but the UIElementsCustomDrawer seems to just be inheriting from ImguiCustomDrawer and not actually doing anything.)

(I am aware of a hack workaround to make a custom editor for any class that has UIElements property drawers.)

I assume you’re referring to the Unite LA example. The UIElementsCustomDrawer inherits from ImguiCustomDrawer because it implements one additional override: CreatePropertyGUI()
The way it works is if the CustomDrawer implements the IMGUI OnGui(), the system will use it, but if it implements the UIElements CreatePropertyGUI(), it will ignore the IMGUI UI and use pure UIElements. I just used ImguiCustomDrawer as my base to get the existing functionality but you don’t need to do something like that (nor should you).

There’s a more pure example in our scripting docs here:

One more thing, and this is probably why you don’t see them working right now. UIElements is not yet the default for creating default inspectors. That is, if no custom inspector is defined for a type, it will use IMGUI to generate its inspector. UIElements cannot be embedded inside IMGUI (only the other way around), so any custom UIElements property drawers will not work in a default IMGUI inspector. You have to create a custom UIElements inspector for your MonoBehaviour first. This will be fixed at some point.

1 Like

Thank you for the clarification!

I’m glad to hear this is being worked on, because until this is done my initial assessment seems to be correct (effectively if not technically).

Hopefully this is something that can make it into the 2019 cycle.

Is this fixed now?

It still doesn’t seem to work for me in unity 2022.1.0f1

I believe they’ve started to use UI toolkit as a default for inspectors in 2022.2

3 Likes

Indeed. This should no longer be an issue in 2022.2+

2 Likes

Im currently testing it with 2022.2.0a17 and it seems my PropertyDrawer gets completly ignored. Im pretty sure I got everything in there what I need but it just shows the default PropertyDrawer.

Just to be sure maybe someone can check it…
My PropertyDrawer (that gets ignored):

[CustomPropertyDrawer( typeof(TestAttribute) )]
public class TestDrawer : PropertyDrawer
{
    public override VisualElement CreatePropertyGUI( SerializedProperty property )
    {
        var container = new VisualElement();
        container.Add( new Button( () => Debug.Log( "test UiElements" ) ) { text = "ui button" } );
        return container;
    }

    public override void OnGUI( Rect position , SerializedProperty property , GUIContent label )
    {
        var res = GUI.Button( position , "test" );
        if ( res )
        {
            Debug.Log( "test" );
        }
    }
}

My Attribute:

[AttributeUsage( AttributeTargets.Field )] 
public class TestAttribute : Attribute { }

and my MonoBehaviour:

public class TestMb : MonoBehaviour
{
    [SerializeField , Test] int shouldBeReplacedByAButton = 4;
}

I would expect the int field to be completly replaced by a button but nothing happens and it just shows the normal name and value:
8307408--1089807--upload_2022-7-24_19-2-38.png

Am I doing something wrong or should I post a Bug Report?

You need to derive from PropertyAttribute for any Attribute based PropertyDrawer to work.

1 Like

As UI Toolkit seems to be the future, I’m doing my best to adopt it. However, I’m having trouble with indentation of PropertyDrawers, as it doesn’t seem to be respected.

8713245--1177725--Screenshot 2023-01-07 213227.png
Indentation of custom property drawer using uxml is off.

How may I achieve proper indentation using uxml? I use PropertyDrawers extensively and have always preferred their reusability over drawing Editors.

Hi! You can make fields that inherit from BaseField use the desired label width by adding BaseField.alignedFieldUssClassName to them.

1 Like

Thanks, that made it look perfect! Weird that it isn’t part of elements by default though, it seems like such a slam dunk.

I still have trouble with PropertyAttributes, and I can’t really find much about it on the internet. Are they still part of the architecture?

A simple test like this doesn’t work:

//pseudo-code
[ReadOnly] public float f;

public override VisualElement CreatePropertyGUI(SerializedProperty property)
{
    var root = new PropertyField(property);
  
root.AddToClassList(VisualElement.disabledUssClassName);
    return root;
}

If I’d still like to add code via Attributes, how would I go about it?

Using property drawers with attributes does work. It’s the same steps as in IMGUI. The only thing I see wrong with that code is that the proper way to disable elements is to use the SetEnabled method. There may be other things to find with complete example code for an attribute and a drawer.

Hrmm it’s still not working.

I’m gonna post some code: just focus on _max.
8717742--1178508--ReadOnly.png

8717742--1178511--ReadOnlyDrawer.png

_max has ReadOnlyAttribute applied but I’m still able to change _max.

Perhaps it is because FloatParameter has its own property drawer. The UI for it has been created using UI Builder and looks like this:

I’d hope this wouldn’t override any attributes, as it would kind of mess up my workflow. But I dunno, maybe this is a bug?

Hopefully I’m just missing something really obvious, but right now the ReadOnlyDrawer never gets triggered (even if I give it a Debug.Log())


All that said, I really appreciate you helping me out! I hope to fully adopt UI Elements in the future and I am grateful for your help through my awkward first steps.

Hm… I don’t see anything obvious. It shouldn’t matter that FloatParameter has its own drawer. Does ReadOnlyAttribute inherit from PropertyAttribute? Just to help diagnosing this problem, is ReadOnlyDrawer.CreatePropertyGUI being called? Could you put some Debug.Log or breakpoints there to see if it’s being used?

:slight_smile: No problem. I’m happy to help!

1 Like

OH! I see what it is! In the Builder, you are using a FloatField for max. To use PropertyDrawers, you need to use PropertyFields.

1 Like

Aaaaah dayum, that’s a gotcha if I ever saw one. Thanks that worked instantly!

Thank you so much for your help! It’s honestly amazing how easy it is to make UI with the UI Builder. Those were all my pet peeves: consider me converted!

1 Like

I’m still getting No GUI Implemented in the 2023.1.0b1 version when I try to create custom Drawers with UI Toolkit.
Was something changed during the 2023 cycle?

EDIT: I found out that having odin Inspector in my project prevents me from using UIElements in property drawers for some reason

Indeed, I ran into this issue as well. Odin and UI Toolkit really need to play nice together soon.

1 Like

To give an update on this issue re: Odin, Odin now has a feature preview build available that adds support for rendering UI Toolkit visual elements inline, embedded inside its normal IMGUI editor context. This works in 2020.3 and above. So if anybody else is struggling with this, come on our Discord and ask to try it out and we’ll get you set up. We will likely be making the preview generally available on our website soon, and launch it in an actual stable release within a few months.

3 Likes