Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Unity runtime node editor using with Unity UI.

License

NotificationsYou must be signed in to change notification settings

cemuka/UnityRuntimeNodeEditor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

83 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

node editor

Runtime Node Editor

Almost every node editor made in unity is using unity editor to make it.
My goal was make it in runtime with unity ui.

  • Socket based connection
  • Load and save a graph using node serializer
  • Context Menu for graph, nodes and connections
  • Event based notification
  • Pan and zoom
  • Multiple editors can be spawned in a scene
  • Create graph by api or custom prefab
  • Legacy and new Input System

Unity version 2021.3.3f1

node editor

RGB color display example

node editor

Example

Simply extend theNodeEditor.

publicclassExampleNodeEditor:NodeEditor{publicoverridevoidStartEditor(NodeGraphgraph){base.StartEditor(graph);//  make your custom initialization here}}

Create graph using the api, graph will stretch to holder object. (no prefab involves)

publicclassApplicationStartup:MonoBehaviour{publicRectTransformeditorHolder;publicExampleNodeEditoreditor;//  asigned in unity from hierarchyprivatevoidStart(){vargraph=editor.CreateGraph<NodeGraph>(editorHolder);// var graph = editor.CreateGraph<NodeGraph>(editorHolder, bgColor, connColor);editor.StartEditor(graph);}}

You may want to use your own custom graph and prefab as well.

publicclassApplicationStartup:MonoBehaviour{publicRectTransformeditorHolder;publicExampleNodeEditoreditor;privatevoidStart(){editor.StartEditor(graph);}}

Graph actions are event based.

node editor

You'll find a complete example in the Example folder. Let's walkthrough over.

Listen events from editor

publicclassExampleNodeEditor:NodeEditor{privatestring_savePath;publicoverridevoidStartEditor(NodeGraphgraph){base.StartEditor(graph);_savePath=Application.dataPath+"/Example/Resources/graph.json";Events.OnGraphPointerClickEvent+=OnGraphPointerClick;Events.OnGraphPointerDragEvent+=OnGraphPointerDrag;Events.OnNodePointerClickEvent+=OnNodePointerClick;Events.OnConnectionPointerClickEvent+=OnNodeConnectionPointerClick;}}
  • graph context menu
protectedoverridevoidOnGraphPointerClick(PointerEventDataeventData){switch(eventData.button){casePointerEventData.InputButton.Right:{varctx=newContextMenuBuilder().Add("nodes/float",CreateFloatNode).Add("nodes/math op",CreateMatOpNode).Add("graph/load",()=>LoadGraph(_savePath)).Add("graph/save",()=>SaveGraph(_savePath)).Build();SetContextMenu(ctx);DisplayContextMenu();}break;casePointerEventData.InputButton.Left:CloseContextMenu();break;}}
  • node context menu
protectedoverridevoidOnNodePointerClick(Nodenode,PointerEventDataeventData){if(eventData.button==PointerEventData.InputButton.Right){varctx=newContextMenuBuilder().Add("duplicate",()=>DuplicateNode(node)).Add("clear connections",()=>ClearConnections(node)).Add("delete",()=>DeleteNode(node)).Build();SetContextMenu(ctx);DisplayContextMenu();}}
  • connection context menu
protectedoverridevoidOnNodeConnectionPointerClick(stringconnId,PointerEventDataeventData){if(eventData.button==PointerEventData.InputButton.Right){varctx=newContextMenuBuilder().Add("clear connection",()=>DisconnectConnection(connId)).Build();SetContextMenu(ctx);DisplayContextMenu();}}

That's been said, to create a new node:

publicclassMyAwesomeNode:Node{publicTMP_InputFieldvalueField;//  added from editorpublicSocketOutputoutputSocket;//  added from editorpublicSocketInputinputSocket;//  added from editorpublicoverridevoidSetup(){Register(outputSocket);Register(inputSocket);SetHeader("float");}publicoverridevoidOnSerialize(Serializerserializer){//  save values on graph saveserializer.Add("floatValue",valueField.text);//  it would be good idea to use JsonUtility for complex data}publicoverridevoidOnDeserialize(Serializerserializer){//  load values on graph loadvarvalue=serializer.Get("floatValue");valueField.SetTextWithoutNotify(value);}}

To create a node from your editor, pass its path fromResources folder.

//  context item actionsprivatevoidCreateMyNode(){graph.Create("Prefabs/Nodes/MyAwesomeNode");//  your prefab path in resources}

Check out the complete expample inExampleScene for more details.

This project is actively in development.Feel free to drop an issue for any suggestion or feedback.

Wanna support me? Please, consider checkin out my new projectknightborn.
kb

LICENSE

MIT
Copyright (c) 2022 Cem Ugur Karacam

About

Unity runtime node editor using with Unity UI.

Topics

Resources

License

Stars

Watchers

Forks

Contributors5


[8]ページ先頭

©2009-2025 Movatter.jp