编辑器基类与扩展点

编辑器层由图资产、Controller、窗口、图 View、节点外壳和节点内容 View 组成。

1
2
3
4
5
6
NodeGraphAsset
    -> NodeGraphController
    -> NodeEditorWindowBase
    -> NodeGraphViewBase
    -> NodeBase<TData>
    -> NodeViewBase<TData>

图资产

NodeGraphAsset 是图配置的 ScriptableObject，保存以下内容：

  • graphId：图的稳定标识。
  • graphName：创建时生成的图名称。
  • serializedGraph：编辑器图序列化结果。

新建图资产默认保存到：

1
Assets/NodeGraphView/Editor Default Resources/GraphData/{GraphName}.asset

Controller

NodeGraphController 是业务图的编辑器策略层，常见覆盖点包括：

1
2
3
4
5
6
7
8
public override Type AssetType => typeof(TaskGraphAsset);
public override Type EditorWindowType => typeof(TaskGraphWindow);
public override Type GraphViewType => typeof(NodeGraphView.NodeGraphView);

public override string GetExportFolderPath(NodeGraphAsset asset)
{
    return "Assets/Resources/TaskGraphs";
}

Controller 还负责节点创建数据、端口数据、连接规则、图序列化和 Runtime 图导出。

窗口与图 View

NodeEditorWindowBase 提供通用窗口生命周期、保存、导出和调试高亮。业务窗口继承它后，可通过 BuildToolbar 加入业务按钮。

NodeGraphViewBase 负责 GraphView 的节点创建、连线、删除、保存和导出。业务通常不需要重写它，只有在需要特殊交互时才扩展。

节点外壳与节点内容

NodeBase 是所有编辑器节点共用的外壳，负责：

  • 标题编辑。
  • 节点 ID 显示。
  • ID 复制按钮。
  • 输入与输出端口。
  • 节点尺寸、样式和右键菜单。

NodeViewBase<TData> 只负责业务节点的内容区。例如 Task 节点的名称和描述编辑字段属于 TaskNodeView。

1
2
3
4
5
6
7
8
9
10
11
public class TaskNode : NodeBase<TaskNodeData>
{
}

public class TaskNodeView : NodeViewBase<TaskNodeData>
{
    public override void Build(VisualElement root)
    {
        // 创建业务字段。
    }
}

Task 节点的代码结构

Task 业务在通用编辑器基类上增加自己的资产、Controller、窗口、节点和内容 View。通用层负责图编辑和节点外壳，业务层只描述 Task 的数据、固定端口与内容区。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
classDiagram
    class NodeGraphAsset
    class TaskGraphAsset
    NodeGraphAsset <|-- TaskGraphAsset

    class NodeGraphController
    class TaskGraphController
    NodeGraphController <|-- TaskGraphController

    class NodeEditorWindowBase
    class TaskGraphWindow
    NodeEditorWindowBase <|-- TaskGraphWindow

    class NodeGraphViewBase

    class NodeBase~TData~ {
        +标题编辑
        +ID 与复制按钮
        +输入输出端口
        +尺寸、样式、右键菜单
    }
    class TaskNode {
        +Task 固定端口规则
    }
    NodeBase~TData~ <|-- TaskNode

    class NodeViewBase~TData~ {
        +Build(root)
    }
    class TaskNodeView {
        +Task 名称与描述字段
    }
    NodeViewBase~TData~ <|-- TaskNodeView

    class TaskNodeData
    TaskNode --> TaskNodeData
    TaskNode --> TaskNodeView : 创建内容 View
    TaskGraphWindow --> NodeGraphViewBase : 持有
    TaskGraphController --> TaskGraphAsset : 管理

图中 NodeBase<TData> 是所有节点共用的 View 外壳；TaskNode 只补充 Task 的端口规则；TaskNodeView 只构建 Task 的业务内容区。这使后续业务可以沿用相同结构，而不需要修改通用编辑器代码。