【Unity】关系网络图的简单实现

1.效果展示

unity关系网络图

2.简介

本项目是以UGUI为基础创建的一个简单的可交互关系网络图。基本实现了节点的添加、关联、创建等功能。提供了一种在Unity中实现可交互的关系网络图的思路。
本项目中节点与线段是以预制体的形式生成的，所绘制的关系线段也为UGUI，是一个继承于Graphic的类，只适用于UI层，若希望在3D项目中绘制线段，可使用Unity原生LineRender。

3.操作说明

点击Create按钮会创建一个节点。
点击某个节点会以绿色高亮显示，并且其关联节点和线段将以黄色高亮显示。
可以拖拽某个节点到任意位置。
点击DrawLine按钮会开启连线模式，会在先后点击的两个节点之间创建一条UGUI线段，该线段会随着关联节点的位置实时更新。
点击Delete按钮将会删除当前选中的节点，与之关联的线段也会随之删除。

4.核心代码

1）Data.cs

//基本的数据结构
public class Node
{
    public string Name;
    public List<Node> Children;
}

public class Line
{
    public string Name;
    public Node Node_1;
    public Node Node_2;
}

2）DragEvent.cs

//为节点添加拖拽事件
public class DragEvent : MonoBehaviour, IDragHandler,IBeginDragHandler,IEndDragHandler
{
    private RectTransform panelRectTransform;

    private void Awake()
    {
        panelRectTransform = transform as RectTransform;
    }
    public void OnDrag(PointerEventData eventData)
    {
        Vector3 pos;
        RectTransformUtility.ScreenPointToWorldPointInRectangle(panelRectTransform, eventData.position, eventData.enterEventCamera, out pos);
        transform.position = pos;
    }

    public void OnBeginDrag(PointerEventData eventData)
    {
        
    }

    public void OnEndDrag(PointerEventData eventData)
    {
        
    }
}

3）UILineRenderer.cs

//挂载在线条对象上的脚本，控制线条的绘制
[RequireComponent(typeof(CanvasRenderer))]
public class UILineRenderer : Graphic
{

    public Vector2 startPoint;
    public Vector2 endPoint;
    public float thickness = 2f;

    public Line line;

    protected override void OnPopulateMesh(VertexHelper vh)
    {
        vh.Clear();

        var rect = rectTransform.rect;
        var dir = (endPoint - startPoint).normalized;
        var normal = new Vector2(-dir.y, dir.x) * thickness / 2f;

        var corner1 = startPoint - normal;
        var corner2 = startPoint + normal;
        var corner3 = endPoint + normal;
        var corner4 = endPoint - normal;

        vh.AddVert(corner1, color, new Vector2(0, 0));
        vh.AddVert(corner2, color, new Vector2(0, 1));
        vh.AddVert(corner3, color, new Vector2(1, 1));
        vh.AddVert(corner4, color, new Vector2(1, 0));

        vh.AddTriangle(0, 1, 2);
        vh.AddTriangle(2, 3, 0);
    }

    // Call this method to update line position
    public void SetPositions(Vector2 start, Vector2 end)
    {
        startPoint = start;
        endPoint = end;
        SetVerticesDirty(); // Causes the graphic to redraw
    }
}

4）ImageNode.cs

//挂载在节点上的脚本，用于注册节点和交互事件
public class ImageNode : MonoBehaviour
{
    public Node ImgNode;

    public void Init(string name,UnityAction action)
    {
        ImgNode=new Node();
        ImgNode.Name=name;
        ImgNode.Children=new List<Node>();
        transform.Find("Text").GetComponent<Text>().text = name;
        transform.GetComponent<Button>().onClick.AddListener(action);
    }

    public void AddNodeIntoChildren(Node node)
    {
        if(ImgNode.Children.Contains(node))
        {
            return;
        }
        ImgNode.Children.Add(node);
    }
}

5.Package

百度云
链接：https://pan.baidu.com/s/1Baaj034-gMZhjTY4YoDOvw?pwd=7ofb
提取码：7ofb