Unity3D

【Unity3D】点选物体、框选物体、绘制外边框

2023-03-18  本文已影响0人  LittleFatSheep

1 需求描述

绘制物体外框线条盒子 中介绍了绘制物体外框长方体的方法,本文将介绍物体投影到屏幕上的二维外框绘制方法。

滑动框效果如下:

选中边框效果如下:

本文完整代码见→ Unity3D点选物体、框选物体、绘制外边框

2 需求实现

2.1 场景搭建

1)场景对象

说明:Plane 的 Layer 设置为 Plane (值为 6)。

2)滑动框

拖拽鼠标时,屏幕上会出现滑动框。SlideBox 对象用于显示滑动框,其 Image 组件中,Source Image 设置为红色滑动框 Sprite,去掉 Raycast Target 勾选,Image Type 设置为 Sliced;RectTransform 组件中,Pivot 设置为 (0, 0),Width、Height 都设置为 0。参数设置如下:

滑动框图片如下:

说明:滑动框图片是 png 格式,中间部分都是半透明的,图片导入 Unity 后,需要修改 Texture Type 为 Sprite,Sprite Mode 设置为 Multiple,并且需要在 Sprite Editor 中 编辑 border(九宫格格式),如下:

2)选框

选中物体后,选中的物体边界会显示外边框(选框)。SelectBox 对象用于显示选框,其 Image 组件中,Source Image 设置为黄色外框 Sprite,去掉 Raycast Target 勾选,Image Type 设置为 Sliced;RectTransform 组件中,Pivot 设置为 (0, 0),Width、Height 都设置为 0。参数设置如下:

外框图片如下:

说明:外框图片是 png 格式,并且除了黄色边角,其他部分都是透明的,图片导入 Unity 后,需要修改 Texture Type 为 Sprite,Sprite Mode 设置为 Multiple,并且需要在 Sprite Editor 中 编辑 border(九宫格格式),如下:

2.2 代码

EventDetector.cs

using UnityEngine;
 
public class EventDetector : MonoBehaviour { // 事件检测器
    private MyEventType eventType = MyEventType.None; // 事件类型
    private MyEventType lastEventType = MyEventType.None; // 上次事件类型
    private float scroll; // 滑轮滑动刻度
    private bool detecting; // 事件检测中
    private Vector3 clickDownMousePos; // 鼠标按下时的坐标
    private const float dragThreshold = 1; // 识别为拖拽的鼠标偏移
 
    private void Update() {
        detecting = true;
        DetectMouseEvent();
        DetectScrollEvent();
        UpgradeMouseEvent();
        detecting = false;
        lastEventType = eventType;
    }
 
    private void DetectMouseEvent() { // 检测鼠标事件
        if (Input.GetMouseButtonDown(0)) { // Click Down
            eventType = MyEventType.ClickDown;
            clickDownMousePos = Input.mousePosition;
        } else if (Input.GetMouseButtonUp(0)) {
            if (IsDragEvent(eventType)) { // End Drag
                eventType = MyEventType.EndDrag;
            } else { // Click Up
                eventType = MyEventType.ClickUp;
            }
        } else if (Input.GetMouseButton(0)) {
            if (IsDragEvent(eventType)) { // Drag
                eventType = MyEventType.Drag;
            } else if (Vector3.Distance(clickDownMousePos, Input.mousePosition) > dragThreshold) { // Begin Drag
                eventType = MyEventType.BeginDrag;
            } else { // Click
                eventType = MyEventType.Click;
            }
        } else {
            eventType = MyEventType.None;
        }
    }
 
    private void DetectScrollEvent() { // 检测滑轮事件
        if (eventType != MyEventType.None
            && (!IsBeginEvent(eventType) || lastEventType != MyEventType.None && !IsScrollEvent(lastEventType))) {
            scroll = 0;
            return;
        }
        float temScroll = Input.GetAxis("Mouse ScrollWheel");
        if (Mathf.Abs(scroll) < float.Epsilon && Mathf.Abs(temScroll) > float.Epsilon) { // Begin Scroll
            eventType = MyEventType.BeginScroll;
            scroll = temScroll;
        } else if (Mathf.Abs(scroll) > float.Epsilon && Mathf.Abs(temScroll) < float.Epsilon) { // End Scroll
            eventType = MyEventType.EndScroll;
            scroll = temScroll;
        } else if (Mathf.Abs(temScroll) > float.Epsilon) { // Scroll
            eventType = MyEventType.Scroll;
            scroll = temScroll;
        } else {
            scroll = 0;
        }
    }
 
    private void UpgradeMouseEvent() { // 升级鼠标事件(关联键盘事件)
        if (eventType == MyEventType.None) {
            return;
        }
        if (IsBeginEvent(eventType)) {
            if (Input.GetKey(KeyCode.LeftControl) || Input.GetKey(KeyCode.RightControl)) {
                AddKeyType("Ctrl");
            } else if (Input.GetKey(KeyCode.LeftAlt) || Input.GetKey(KeyCode.RightAlt)) {
                AddKeyType("Alt");
            }
        } else {
            ContinueKeyType(); // 保持按键事件
        }
    }
 
    public MyEventType EventType() { // 事件类型
        if (detecting) {
            return lastEventType;
        }
        return eventType;
    }
 
    public bool HasClickEvent() { // 是否有点击事件
        MyEventType type = EventType();
        return IsClickEvent(type);
    }
 
    public bool HasDragEvent() { // 是否有拖拽事件
        MyEventType type = EventType();
        return IsDragEvent(type);
    }
 
    public bool HasScrollEvent() { // 是否有滑轮事件
        MyEventType type = EventType();
        return IsScrollEvent(type);
    }

    public bool HasCtrlScrollEvent() { // 是否有Ctrl滑轮事件
        MyEventType type = EventType();
        return type >= MyEventType.BeginCtrlScroll && type <= MyEventType.EndCtrlScroll;
    }
 
    public bool IsBeginDrag() { // 是否是开始拖拽类型事件
        MyEventType type = EventType();
        return type == MyEventType.BeginDrag || type == MyEventType.BeginCtrlDrag || type == MyEventType.BeginAltDrag;
    }
 
    public float Scroll() { // 鼠标滑轮滑动刻度
        if (HasScrollEvent()) {
            return scroll;
        }
        return 0;
    }
 
    private bool IsClickEvent(MyEventType type) { // 是否是点击事件
        return type >= MyEventType.ClickDown && type <= MyEventType.CtrlClickUp;
    }
 
    private bool IsDragEvent(MyEventType type) { // 是否是拖拽事件
        return type >= MyEventType.BeginDrag && type <= MyEventType.EndAltDrag;
    }
 
    private bool IsScrollEvent(MyEventType type) { // 是否是滑轮事件
        return type >= MyEventType.BeginScroll && type <= MyEventType.EndCtrlScroll;
    }
 
    private bool IsBeginEvent(MyEventType type) { // 是否是开始类型事件
        return type == MyEventType.ClickDown
            || type == MyEventType.BeginDrag
            || type == MyEventType.BeginCtrlDrag
            || type == MyEventType.BeginAltDrag
            || type == MyEventType.BeginScroll
            || type == MyEventType.BeginCtrlScroll;
    }
 
    private bool HasCtrlKey(MyEventType type) { // 是否有Ctrl按键事件
        return type >= MyEventType.CtrlClickDown && type <= MyEventType.CtrlClickUp
            || type >= MyEventType.BeginCtrlDrag && type <= MyEventType.EndCtrlDrag
            || type >= MyEventType.BeginCtrlScroll && type <= MyEventType.EndCtrlScroll;
    }
 
    private bool HasAltKey(MyEventType type) { // 是否有Alt按键事件
        return type >= MyEventType.BeginAltDrag && type <= MyEventType.EndAltDrag;
    }
 
    private void ContinueKeyType() { // 保持按键事件
        if (HasCtrlKey(lastEventType)) {
            AddKeyType("Ctrl");
        } else if (HasAltKey(lastEventType)) {
            AddKeyType("Alt");
        }
    }
 
    private void AddKeyType(string key) { // 添加按键事件
        if ("Ctrl".Equals(key)) {
            if (eventType == MyEventType.ClickDown) { // 点击事件
                eventType = MyEventType.CtrlClickDown;
            } else if (eventType == MyEventType.Click) {
                eventType = MyEventType.CtrlClick;
            } else if (eventType == MyEventType.ClickUp) {
                eventType = MyEventType.CtrlClickUp;
            } else if (eventType == MyEventType.BeginDrag) { // 拖拽事件
                eventType = MyEventType.BeginCtrlDrag;
            } else if (eventType == MyEventType.Drag) {
                eventType = MyEventType.CtrlDrag;
            } else if (eventType == MyEventType.EndDrag) {
                eventType = MyEventType.EndCtrlDrag;
            } else if (eventType == MyEventType.BeginScroll) { // 滑轮事件
                eventType = MyEventType.BeginCtrlScroll;
            } else if (eventType == MyEventType.Scroll) {
                eventType = MyEventType.CtrlScroll;
            } else if (eventType == MyEventType.EndScroll) {
                eventType = MyEventType.EndCtrlScroll;
            }
        } else if ("Alt".Equals(key)) {
            if (eventType == MyEventType.BeginDrag) { // 拖拽事件
                eventType = MyEventType.BeginAltDrag;
            } else if (eventType == MyEventType.Drag) {
                eventType = MyEventType.AltDrag;
            } else if (eventType == MyEventType.EndDrag) {
                eventType = MyEventType.EndAltDrag;
            }
        }
    }
}
 
public enum MyEventType { // 事件类型
    None = 0,
    ClickDown = 1,
    Click = 2,
    ClickUp = 3,
    CtrlClickDown = 4,
    CtrlClick = 5,
    CtrlClickUp = 6,
    BeginDrag = 10,
    Drag = 11,
    EndDrag = 12,
    BeginCtrlDrag = 13,
    CtrlDrag = 14,
    EndCtrlDrag = 15,
    BeginAltDrag = 16,
    AltDrag = 17,
    EndAltDrag = 18,
    BeginScroll = 20,
    Scroll = 21,
    EndScroll = 22,
    BeginCtrlScroll = 23,
    CtrlScroll = 24,
    EndCtrlScroll = 25
}

说明: EventDetector 脚本组件挂在相机下,用于统一管理事件。点选物体(ClickUp / Ctrl + ClickUp)、滑动选框(Drag)、场景变换(Ctrl + Drag / Alt + Drag)都有鼠标事件,这些事件相互冲突,不便于在每个类里都去捕获鼠标和键盘事件,因此需要 EventDetector 统一管理事件。

ClickSelect.cs

using System.Collections.Generic;
using UnityEngine;

public class ClickSelect : MonoBehaviour { // 点选物体
    private EventDetector eventDetector; // 鼠标事件检测器
    private List<Transform> targets; // 选中的游戏对象
    private List<Transform> loseFocus; // 失焦的游戏对象
    private RaycastHit hit; // 碰撞信息

    private void Awake() {
        targets = new List<Transform>();
        loseFocus = new List<Transform>();
        eventDetector = Camera.main.GetComponent<EventDetector>();
        GameObject.Find("Work").GetComponent<SlideSelect>().targetsChangedHandler += SetTargets;
    }

    private void Update() {
        if (eventDetector.EventType() == MyEventType.ClickUp || eventDetector.EventType() == MyEventType.CtrlClickUp) {
            Transform hitTrans = GetHitTrans();
            if (hitTrans == null || hitTrans.gameObject.layer == LayerMask.NameToLayer("Plane")) { // 未选中物体或点到地面, 全部取消选中
                targets.ForEach(obj => loseFocus.Add(obj));
                targets.Clear();
            }
            else if (eventDetector.EventType() == MyEventType.CtrlClickUp) {
                if (targets.Contains(hitTrans)) { // Ctrl重复选中, 取消选中
                    loseFocus.Add(hitTrans);
                    targets.Remove(hitTrans);
                } else { // Ctrl追加选中
                    targets.Add(hitTrans);
                }
            } else { // 单选
                targets.ForEach(trans => loseFocus.Add(trans));
                loseFocus.Remove(hitTrans);
                targets.Clear();
                targets.Add(hitTrans);
            }
            UpdateSelectColor();
            RectPainter.DrawRect(targets);
        }
    }

    private void UpdateSelectColor() { // 更新选中的物体颜色
        foreach(var item in loseFocus) {
            item.GetComponent<Renderer>().material.color = Color.gray;
        }
        foreach(var item in targets) {
            item.GetComponent<Renderer>().material.color = Color.red;
        }
        loseFocus.Clear();
    }

    private void SetTargets(List<Transform> targets) { // 框选时触发
        this.targets.ForEach(trans => loseFocus.Add(trans));
        if (targets == null) {
            this.targets.Clear();
        } else {
            this.targets = targets;
            this.targets.ForEach(trans => loseFocus.Remove(trans));
        }
        UpdateSelectColor();
    }

    private Transform GetHitTrans() { // 获取屏幕射线碰撞的物体
        Ray ray = Camera.main.ScreenPointToRay(Input.mousePosition);
        if (Physics.Raycast(ray, out hit)) {
            return hit.transform;
        }
        return null;
    }
}

说明:ClickSelect 脚本组件挂在 Work 对象下,用于点选物体。

SlideSelect.cs

using System;
using System.Collections.Generic;
using UnityEngine;

public class SlideSelect : MonoBehaviour { // 滑动框选物体
    public Action<List<Transform>> targetsChangedHandler; // 框选目标改变时的处理器
    private EventDetector eventDetector; // 鼠标事件检测器
    private RectTransform slideTrans; // 滑动选框
    private Vector3 preMousePos; // 鼠标滑动前的位置
    private Transform work; // 需要检测是否被框选的物体根对象
    private List<Transform> targets; // 框选的目标对象

    private void Awake() {
        slideTrans = GameObject.Find("Canvas/SlideBox").GetComponent<RectTransform>();
        work = GameObject.Find("Work").transform;
        eventDetector = Camera.main.GetComponent<EventDetector>();
    }

    private void Update() {
        if (eventDetector.EventType() == MyEventType.BeginDrag) {
            preMousePos = Input.mousePosition;
        } else if (eventDetector.EventType() == MyEventType.EndDrag) {
            Rect rect = slideTrans.rect;
            rect.position = slideTrans.position;
            targets = RectPainter.DrawRect(work, rect);
            targetsChangedHandler?.Invoke(targets);
            ClearRect();
        } else if (eventDetector.EventType() == MyEventType.Drag) {
            DrawRect();
        }
    }

    private void DrawRect() { // 绘制滑动选框
        float minX = Mathf.Min(Input.mousePosition.x, preMousePos.x);
        float minY = Mathf.Min(Input.mousePosition.y, preMousePos.y);
        slideTrans.position = new Vector3(minX, minY, 0);
        Vector3 delta = Input.mousePosition - preMousePos;
        slideTrans.sizeDelta = new Vector2(Mathf.Abs(delta.x), Mathf.Abs(delta.y));
    }

    private void ClearRect() { // 清除滑动选框
        slideTrans.sizeDelta = Vector2.zero;
    }
}

说明:SlideSelect 脚本组件挂在 Work 对象下,用于滑动框选物体。

RectDetector.cs

using System;
using System.Collections.Generic;
using UnityEngine;

public class RectDetector { // 边框检测器
    public static Rect GetRect(List<Transform> targets) { // 获取物体的外边框(包含子对象)
        if (targets != null && targets.Count > 0) {
            Rect[] rects = new Rect[targets.Count];
            for (int i = 0; i < targets.Count; i++) {
                rects[i] = GetRect(targets[i]);
            }
            return GetRect(rects);
        }
        return new Rect();
    }

    public static Rect GetCurrRect(List<Transform> targets) { // 获取物体的外边框(不包含子对象)
        if (targets != null && targets.Count > 0) {
            Rect[] rects = new Rect[targets.Count];
            for (int i = 0; i < targets.Count; i++) {
                rects[i] = GetCurrRect(targets[i]);
            }
            return GetRect(rects);
        }
        return new Rect();
    }

    public static Rect GetRect(Transform transform) { // 获取物体外边框(包含子物体)
        Rect rect = GetInitRect();
        ForAllChildren(transform, trans => {
            Rect rect1 = GetCurrRect(trans);
            rect.xMin = Mathf.Min(rect.xMin, rect1.xMin);
            rect.yMin = Mathf.Min(rect.yMin, rect1.yMin);
            rect.xMax = Mathf.Max(rect.xMax, rect1.xMax);
            rect.yMax = Mathf.Max(rect.yMax, rect1.yMax);
        });
        return rect;
    }

    public static Rect GetCurrRect(Transform transform) { // 获取物体外边框(不包含子对象)
        Rect rect = GetInitRect();
        Vector3[] vertices = GetVertices(transform);
        if (vertices != null && vertices.Length > 0) {
            for (int i = 0; i < vertices.Length; i++) {
                Vector3 screenPos = Camera.main.WorldToScreenPoint(vertices[i]);
                rect.xMin = Mathf.Min(rect.xMin, screenPos.x);
                rect.yMin = Mathf.Min(rect.yMin, screenPos.y);
                rect.xMax = Mathf.Max(rect.xMax, screenPos.x);
                rect.yMax = Mathf.Max(rect.yMax, screenPos.y);
            }
        }
        return rect;
    }

    private static Rect GetRect(Rect[] rects) { // 合并一组边框
        if (rects == null || rects.Length == 0) {
            return new Rect();
        }
        Rect rect = rects[0];
        for (int i = 1; i < rects.Length; i++) {
            rect.xMin = Mathf.Min(rect.xMin, rects[i].xMin);
            rect.yMin = Mathf.Min(rect.yMin, rects[i].yMin);
            rect.xMax = Mathf.Max(rect.xMax, rects[i].xMax);
            rect.yMax = Mathf.Max(rect.yMax, rects[i].yMax);
        }
        return rect;
    }

    private static Rect GetInitRect() { // 获取初始的边框
        Rect rect = new Rect();
        rect.xMin = float.MaxValue;
        rect.yMin = float.MaxValue;
        rect.xMax = float.MinValue;
        rect.yMax = float.MinValue;
        return rect;
    }

    private static Vector3[] GetVertices(Transform transform) { // 获取网格顶点的世界坐标
        if (transform.GetComponent<MeshFilter>() == null || transform.GetComponent<MeshFilter>().mesh == null) {
            return null;
        }
        Vector3[] vertices = transform.GetComponent<MeshFilter>().mesh.vertices;
        for (int i = 0; i < vertices.Length; i++)
        {
            vertices[i] = transform.TransformPoint(vertices[i]);
        }
        return vertices;
    }

    private static void ForAllChildren(Transform transform, Action<Transform> action) { // 对所有子对象执行活动
        if (transform == null || action == null) {
            return;
        }
        Transform[] children = transform.GetComponentsInChildren<Transform>();
        for(int i = 0; i < children.Length; i++) {
            action(children[i]);
        }
    }
}

说明:RectDetector 通过遍历 mesh 的所有顶点,并将其投射到屏幕上,以计算出物体的屏幕选框大小。

RectPainter.cs

using System;
using System.Collections.Generic;
using UnityEngine;

public class RectPainter { // 矩形选框渲染器
    private const float border = 5; // 矩形选框的边界宽度
    private static RectPainter instance; // 单例
    private RectTransform selectTrans; // 选框
    private List<Transform> targets; // 选中的游戏对象

    private RectPainter() {
        selectTrans = GameObject.Find("Canvas/SelectBox").transform as RectTransform;
        Camera.main.GetComponent<SceneController>().camChangedHandler += DrawRect;
    }

    public static RectPainter GetInstance() { // 获取单例
        if (instance == null) {
            instance = new RectPainter();
        }
        return instance;
    }

    public static void DrawRect(List<Transform> targets) { // 绘制被选中物体的外边框(包含子对象)
        if (instance != null) {
            instance.targets = targets;
            Rect rect = RectDetector.GetRect(targets);
            instance.DrawRect(rect);
        }
    }

    public static void DrawCurrRect(List<Transform> targets) { // 绘制被选中物体的外边框(不包含子对象)
        if (instance != null) {
            instance.targets = targets;
            Rect rect = RectDetector.GetCurrRect(targets);
            instance.DrawRect(rect);
        }
    }

    public static List<Transform> DrawRect(Transform root, Rect rect) { // 绘制root下面的在rect内的物体的外边框
        if (instance != null) {
            instance.targets = new List<Transform>();
            ForAllChildren(root, trans => {
                Rect rect1 = RectDetector.GetCurrRect(trans);
                if (ContainsRect(rect, rect1)) {
                    instance.targets.Add(trans);
                }
            });
            instance.DrawCurrRect();
            return instance.targets;
        }
        return null;
    }

    private void DrawRect() { // 绘制边框(包含子对象)
        Rect rect = RectDetector.GetRect(targets);
        DrawRect(rect);
    }

    private void DrawCurrRect() { // 绘制边框(不包含子对象)
        Rect rect = RectDetector.GetCurrRect(targets);
        DrawRect(rect);
    }

    private void DrawRect(Rect rect) { // 绘制边框
        selectTrans.position = new Vector3(rect.x - border, rect.y - border, 0);
        selectTrans.sizeDelta = new Vector2(rect.width + border * 2, rect.height + border * 2);
    }

    private static bool ContainsRect(Rect rect1, Rect rect2) { // 判断rect1是否包含rect2
        if (rect1.width <= 0 || rect1.height <= 0 || rect2.width <= 0 || rect2.height <= 0) {
            return false;
        }
        if (rect2.xMin < rect1.xMin || rect2.yMin < rect1.yMin || rect2.xMax > rect1.xMax || rect2.yMax > rect1.yMax) {
            return false;
        }
        return true;
    }

    private static void ForAllChildren(Transform transform, Action<Transform> action) { // 对所有子对象执行活动
        if (transform == null || action == null) {
            return;
        }
        Transform[] children = transform.GetComponentsInChildren<Transform>();
        for(int i = 0; i < children.Length; i++) {
            action(children[i]);
        }
    }
}

SceneController.cs

using System;
using UnityEngine;
 
public class SceneController : MonoBehaviour {
    private EventDetector eventDetector; // 鼠标事件检测器
    public Action camChangedHandler; // 相机改变处理器
    private Transform cam; // 相机
    private float nearPlan; // 近平面
    private Vector3 preMousePos; // 上一帧的鼠标坐标
 
    private void Awake() {
        cam = Camera.main.transform;
        nearPlan = Camera.main.nearClipPlane;
        eventDetector = cam.GetComponent<EventDetector>();
    }
 
    private void Update() { // 更新场景(Ctrl+Scroll: 缩放场景, Ctrl+Drag: 平移场景, Alt+Drag: 旋转场景)
        if (eventDetector.HasCtrlScrollEvent()) { // 缩放场景
            ScaleScene(eventDetector.Scroll());
        } else if (eventDetector.IsBeginDrag()) {
            preMousePos = Input.mousePosition;
        } else if (eventDetector.HasDragEvent()) {
            Vector3 offset = Input.mousePosition - preMousePos;
            if (eventDetector.EventType() == MyEventType.CtrlDrag) { // 移动场景
                MoveScene(offset);
            } else if (eventDetector.EventType() == MyEventType.AltDrag) { // 旋转场景
                RotateScene(offset);
            }
            preMousePos = Input.mousePosition;
        }
    }
 
    private void ScaleScene(float scroll) { // 缩放场景
        cam.position += cam.forward * scroll;
        camChangedHandler?.Invoke();
    }
 
    private void MoveScene(Vector3 offset) { // 平移场景
        cam.position -= (cam.right * offset.x / 100 + cam.up * offset.y / 100);
        camChangedHandler?.Invoke();
    }
 
    private void RotateScene(Vector3 offset) { // 旋转场景
        Vector3 rotateCenter = GetRotateCenter(0);
        cam.RotateAround(rotateCenter, Vector3.up, offset.x / 3); // 水平拖拽分量
        cam.LookAt(rotateCenter);
        cam.RotateAround(rotateCenter, -cam.right, offset.y / 5); // 竖直拖拽分量
        camChangedHandler?.Invoke();
    }
 
    private Vector3 GetRotateCenter(float planeY) { // 获取旋转中心
        if (Mathf.Abs(cam.forward.y) < Vector3.kEpsilon || Mathf.Abs(cam.position.y) < float.Epsilon)
        {
            return cam.position + cam.forward * (nearPlan + 1 / nearPlan);
        }
        float t = (planeY - cam.position.y) / cam.forward.y;
        float x = cam.position.x + t * cam.forward.x;
        float z = cam.position.z + t * cam.forward.z;
        return new Vector3(x, planeY, z);
    }
}

说明: SceneController 脚本组件挂在相机下,用于平移、旋转、缩放场景,其原理见→缩放、平移、旋转场景

3 运行效果

点选效果如下:

框选效果如下:

声明:本文转自点选物体、框选物体、绘制外边框

上一篇下一篇

猜你喜欢

热点阅读