Extending Unity UI components with custom Inspector

Question

Is it possible to extend the new unity ui components like for example the transform component? Because nothing happens when i try to extend the button, instead of the transform component

using UnityEditor;
using UnityEngine;
[CustomEditor(typeof(Transform))]
public class CustomTransform : Editor
{
    public override void OnInspectorGUI()
    {            
    }
}

That's not extending, it's just an editor for a specific Component that derives from MonoBehaviour — Tseng
– Tseng, Commented Mar 14, 2015 at 18:52
So it is only possible to extend components that derive from MonoBehavior? — Eknoes
– Eknoes, Commented Mar 14, 2015 at 19:00
Extending in C# means, create a new class which derives from another class, aka inheritance. The above code snippet isn't related to inheritance, it is and editor extension. public class Player : MonoBehavior { } is extending MonoBehavior and adds new functionality. And UI components can be extended, you just need to inherit from them, not from Editor. The Editor is for a simplified UI within the Unity Inspector — Tseng
– Tseng, Commented Mar 14, 2015 at 19:04
If you need to recompile your own version of the Unity UI (i.e. cause inheritance may not work in a certain case), you can download the Unity UI Source from bitbucket.org/Unity-Technologies/ui and compile it yourself. Check the read me on that page on how to replace the Unity standard UI assemblies with your newly compiled ones — Tseng
– Tseng, Commented Mar 14, 2015 at 19:06
Sorry i used extending again. I said extend, because i just want to add a few GUI controls to the editor and then use DrawDefaultInspector() So i'm not talking about inheritance. Edit: Didn't read your last comment. Should have refreshed before posting — Eknoes
– Eknoes, Commented Mar 14, 2015 at 19:15

Greg Lukosek · Accepted Answer · 2023-05-10 10:02:57Z

26

Yes you can extend UI components and write them their own custom inspector. You just need to remember to use right namespaces and also inherit from the right Inspector class.

You can of course override too!.

Example here is a UISegmentedControlButton

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;
using System.Collections;

public class UISegmentedControlButton : Button {

public Sprite offSprite;
public Sprite onSprite;
public Color offTextColor = Color.white;
public Color onTextColor = Color.white;

private bool isSelected;
public bool IsSelected {
    get {
        return isSelected;
    }
    set {
        isSelected = value;

        Text text = this.transform.GetComponentInChildren<Text>();

        if (value) {
            this.GetComponent<Image>().sprite = onSprite;
            text.color = onTextColor;
        } else {
            this.GetComponent<Image>().sprite = offSprite;
            text.color = offTextColor;
        }
    }
}




public override void OnPointerClick(PointerEventData eventData) {

    this.transform.parent.GetComponent<UISegmentedControl>().SelectSegment(this);
    base.OnPointerClick(eventData);
}

}

And Editor class for it:

P.S. ButtonEditor is different from UnityEditor.UI.ButtonEditor as the first one is from UnityEngine.ButtonEditor. To access .UI from UnityEditor, you need to put your Editor script under Editor folder

using UnityEngine;
using UnityEditor;
using UnityEngine.UI;
using System.Collections;

[CustomEditor(typeof(UISegmentedControlButton))]
public class UISegmentedControlButtonEditor : UnityEditor.UI.ButtonEditor {


public override void OnInspectorGUI() {

    UISegmentedControlButton component = (UISegmentedControlButton)target;

    base.OnInspectorGUI();

    component.onSprite = (Sprite)EditorGUILayout.ObjectField("On Sprite", component.onSprite, typeof(Sprite), true);
    component.onTextColor = EditorGUILayout.ColorField("On text colour", component.onTextColor);
    component.offSprite = (Sprite)EditorGUILayout.ObjectField("Off Sprite", component.offSprite, typeof(Sprite), true);
    component.offTextColor = EditorGUILayout.ColorField("Off text colour", component.offTextColor);

}
}

Also here is a useful link directly to the source of Unity UI

https://github.com/Unity-Technologies/uGUI

And a little proof that it works:

enter image description here

edited May 10, 2023 at 10:02

answered Jul 21, 2015 at 9:05

Greg Lukosek

1,79220 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

Eknoes Over a year ago

I can't extend from UnityEditor.UI.ButtonEditor in the Editor class. The type does not exist. But i looked at the source on bitbucket and the class does exist and is public. I can only extend from GraphicEditor and TextEditor

Greg Lukosek Over a year ago

Make sure you are using above namespaces. Works 100%. Im using this in the live project now

Eknoes Over a year ago

Thanks. Now it works. Simply forgot to move the script into the editor folder ;) But is there no way to extend the component directly like it's possible with the transform component so that i can use the default button?

Eknoes Over a year ago

I will, but i still would like to know whether it is actually possible to directly extend an ui component.

Greg Lukosek Over a year ago

@Petschko thanks for flagging this up. Looks like they moved to github.com/Unity-Technologies/uGUI I will update the answer

|

Сергей · Accepted Answer · 2022-01-13 08:50:32Z

1

Tried the example above but EditorGUILayout.ObjectField gets empty when I exit the prefab I placed my object in.

However, this method works without zeroing the field.

using Game.Ui.Views.DialoguePanel;
using UnityEditor;
using UnityEditor.UI;

namespace Editor
{
    [CustomEditor(typeof(MyButtonExtension))]
    public class MyButtonExtensionDrawer : ButtonEditor
    {
        SerializedProperty m_testObject;
        
        protected override void OnEnable()
        {
            base.OnEnable();
            m_testObject = serializedObject.FindProperty("testObject");
        }
        
        public override void OnInspectorGUI()
        {
            base.OnInspectorGUI();
            EditorGUILayout.Space();
            
            serializedObject.Update();
            EditorGUILayout.PropertyField(m_testObject);
            serializedObject.ApplyModifiedProperties();
        }
    }
}

In fact, this is just a slightly modified content of the ButtonEditor class.

edited Jan 13, 2022 at 8:50

answered Jan 13, 2022 at 8:46

Сергей

1309 bronze badges

1 Comment

Community Over a year ago

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.

Collectives™ on Stack Overflow

Extending Unity UI components with custom Inspector

2 Answers 2

10 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

10 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related