首页 > 解决方案 > 为什么将 Handles.ArrowHandleCap 添加到一条线时,它没有绘制 ArrowHandleCap?

问题描述

我正在使用编辑器窗口,也许这就是问题所在?

这个想法是在连接两个节点时也在末端位置制作一个箭头,以显示连接的流向。

在屏幕截图中,当我连接两个节点时,例如 Window 0 到 Window 1 所以在 Window 1 附近的行尾应该有一个箭头,表明 Window 0 连接到 Window 1,所以流量是从 Window 0 到窗口 1。

但它没有绘制任何 ArrowHandleCap。

我不介意在结束位置绘制另一个简单的白色箭头,但它现在根本不起作用。根本没有画箭头。

节点

这是我的编辑器窗口代码:

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

public class NodeEditor : EditorWindow
{
    List<Rect> windows = new List<Rect>();
    List<int> windowsToAttach = new List<int>();
    List<int> attachedWindows = new List<int>();

    int tab = 0;
    float size = 10f;

    [MenuItem("Window/Node editor")]
    static void ShowEditor()
    {
        const int width = 600;
        const int height = 600;

        var x = (Screen.currentResolution.width - width) / 2;
        var y = (Screen.currentResolution.height - height) / 2;

        GetWindow<NodeEditor>().position = new Rect(x, y, width, height);
    }


    void OnGUI()
    {
        Rect graphPosition = new Rect(0f, 0f, position.width, position.height);
        GraphBackground.DrawGraphBackground(graphPosition, graphPosition);

        int selected = 0;
        string[] options = new string[]
        {
     "Option1", "Option2", "Option3",
        };
        selected = EditorGUILayout.Popup("Label", selected, options);

        if (windowsToAttach.Count == 2)
        {
            attachedWindows.Add(windowsToAttach[0]);
            attachedWindows.Add(windowsToAttach[1]);
            windowsToAttach = new List<int>();
        }

        if (attachedWindows.Count >= 2)
        {
            for (int i = 0; i < attachedWindows.Count; i += 2)
            {
                DrawNodeCurve(windows[attachedWindows[i]], windows[attachedWindows[i + 1]]);
            }
        }

        BeginWindows();

        if (GUILayout.Button("Create Node"))
        {
            windows.Add(new Rect(10, 10, 200, 40));
        }

        for (int i = 0; i < windows.Count; i++)
        {
            windows[i] = GUI.Window(i, windows[i], DrawNodeWindow, "Window " + i);
        }

        EndWindows();
    }


    void DrawNodeWindow(int id)
    {
        if (GUILayout.Button("Attach"))
        {
            windowsToAttach.Add(id);
        }

        GUI.DragWindow();
    }


    void DrawNodeCurve(Rect start, Rect end)
    {
        Vector3 startPos = new Vector3(start.x + start.width, start.y + start.height / 2, 0);
        Vector3 endPos = new Vector3(end.x, end.y + end.height / 2, 0);
        Vector3 startTan = startPos + Vector3.right * 50;
        Vector3 endTan = endPos + Vector3.left * 50;
        Color shadowCol = new Color(255, 255, 255);

        for (int i = 0; i < 3; i++)
        {// Draw a shadow
            //Handles.DrawBezier(startPos, endPos, startTan, endTan, shadowCol, null, (i + 1) * 5);
        }

        Handles.DrawBezier(startPos, endPos, startTan, endTan, Color.white, null, 5);
        Handles.color = Handles.xAxisColor;
        Handles.ArrowHandleCap(0, endPos, Quaternion.LookRotation(Vector3.right), size, EventType.Repaint);
    }
}

标签: c#unity3d

解决方案


问题是箭头总是在eg后面Window 0,因为你DrawNodeWindow总是在之后调用DrawNodeCurve

发生这种情况是因为箭头总是从endPos正确的方向开始绘制,长度 =size所以你以后总是用窗口覆盖它......你必须改变

// move your endpos to the left by size 
var endPos = new Vector3(end.x - size, end.y + end.height / 2 , 0);

为了让它size在实际end.x位置之前开始离开像素。

在此处输入图像描述

在此处输入图像描述

但是,正如您所看到的,它仍然非常小,因为它通常用于在 3D 空间中显示箭头 - 不使用像素坐标 .. 您可能需要调整 arround 或使用完全不同的东西。


例如,简单地使用 aGUI.DrawTexture而不是给定的箭头精灵怎么样?

// assign this as default reference via the Inspector for that script
[SerializeField] private Texture2D aTexture;

// ...

// since the drawTexture needs a rect which is not centered on the height anymore
// you have to use endPos.y - size / 2 for the Y start position of the texture
GUI.DrawTexture(new Rect(endPos.x, endPos.y - size / 2, size, size), aTexture, ScaleMode.StretchToFill);

就像 Unity 中所有序列化字段的注释中提到的那样,您已经可以引用脚本本身的默认资产(与为 MonoBehaviours 等每个实例执行此操作相反),因此NodeEditor选择的脚本只需引用下载的箭头纹理

在此处输入图像描述

如果使用白色箭头作为纹理,您仍然可以使用

var color = GUI.color;
GUI.color = Handles.xAxisColor;
GUI.DrawTexture(new Rect(endPos.x, endPos.y - size / 2, size, size), aTexture, ScaleMode.StretchToFill);
GUI.color = color;

结果

在此处输入图像描述


PS:示例中使用的箭头图标:https ://iconsplace.com/red-icons/arrow-icon-14您已经可以在下载图标之前直接在该页面上更改颜色;)


推荐阅读