Skip to content

Node Editors

Thor Brigsted edited this page Apr 10, 2020 · 18 revisions
class NodeEditor : NodeEditorBase

What?

Every node is drawn with a NodeEditor. Just like with Unity's custom editors, you can override a lot of the functionality that draws the nodes, for example inlining ports, changing colors, adding texture previews and much more.

How?

Creating custom node editors is very similar to creating custom inspectors for other classes.

Node editors inherit from NodeEditor and have a [CustomNodeEditor(System.Type type)] attribute. They can not be abstract.

Editor scripts also need to be in an editor folder and won't be included in build.

// SimpleNode.cs

public class SimpleNode : Node{
    public int a;
    public int b;
    [Output] public int sum;

    public override object GetValue(NodePort port) {
        return GetSum();
    }

    public float GetSum() {
        return a + b;
    }
}
// Editor/SimpleNodeEditor.cs

[CustomNodeEditor(typeof(SimpleNode))]
public class SimpleNodeEditor : NodeEditor {
    private SimpleNode simpleNode;

    public override void OnBodyGUI() {
        if (simpleNode == null) simpleNode = target as SimpleNode;

        // Update serialized object's representation
        serializedObject.Update();

        NodeEditorGUILayout.PropertyField(serializedObject.FindProperty("a"));
        NodeEditorGUILayout.PropertyField(serializedObject.FindProperty("b"));
        UnityEditor.EditorGUILayout.LabelField("The value is " + simpleNode.GetSum());
        NodeEditorGUILayout.PropertyField(serializedObject.FindProperty("sum"));

        // Apply property modifications
        serializedObject.ApplyModifiedProperties();
    }
}

example

Note: Some features, like adding dynamic ports, should happen outside the serializedObject.Update/Apply methods.

Tips

Change node body text color using EditorStyles
  1. Cache EditorStyles.label, so our code doesn't interfere with other editors
private static GUIStyle editorLabelStyle;

void OnBodyGUI() {
  if (editorLabelStyle == null) editorLabelStyle = new GUIStyle(EditorStyles.label);
}
  1. Temporarily alter EditorStyles.label while GUI is drawn
void OnBodyGUI() {
  if (editorLabelStyle == null) editorLabelStyle = new GUIStyle(EditorStyles.label);
  EditorStyles.label.normal.textColor = Color.white;
  base.OnBodyGUI();
  EditorStyles.label.normal = editorLabelStyle.normal;
}
Add a preview texture to your node

Here we can utilize base.OnBodyGUI() to draw the default editor before adding something to it.

public override void OnBodyGUI() {
  // Draw default editor
  base.OnBodyGUI();

  // Get your node
  MyNode node = target as MyNode;

  // Draw your texture
  EditorGUILayout.LabelField(new GUIContent(node.myTexture));
}
Clone this wiki locally