UGUI检测不规则图片点击

Posted 2021-10-15 头号理想

最近有一个需求 给我几个三角形 他们之间的边相邻
但是我们知道unity中的图片都是矩形的，所以因为他们的位置关系，他们的空白处都会互相影响

就像上边这个图一样，除了三角区域其他都是我们不想要的 接到的需求是 鼠标移动到每个三角里边，都会高亮
我在网上找了好多资料，也找到几种方法

1.计算

我们把三角形的几个顶点以及我们鼠标传进入 然后计算是否鼠标在三角形区域里边
因为我们这里是每帧检测的，所以显然这个不是很适合

2.射线检测

这个的局限性比较大，如果项目中的UI不是很方便的调用相机，我们总不能为了这一个小小的需求去大改我们的整体

3.继承Image

这个是我参考一个博主的文章 下面我给出地址
源地址

这里他是继承unity原生的Image类 然后重写了一个方法

public class IrregularCollision : Image
{
    private PolygonCollider2D _polygon;

    private PolygonCollider2D Polygon
    {
        get
        {
            if (_polygon == null)
                _polygon = GetComponent<PolygonCollider2D>();

            return _polygon;
        }   
    }


    public override bool IsRaycastLocationValid(Vector2 screenPoint, Camera eventCamera)
    {
        Vector3 point;
        RectTransformUtility.ScreenPointToWorldPointInRectangle(rectTransform, screenPoint, eventCamera, out point);
        return Polygon.OverlapPoint(point);
    }
}

我们需要把上边的脚本加载到检测的图片上 然后使用PolygonCollider2D 组件 在图片上绘制出来不规则的范围
这样就可以实现检测