Unity3d中制作触发区域为圆形的按钮

一、常规矩形的Button制作

设置Highlighed Color为绿色。

此时当鼠标在button上方时会显示绿色：

二、圆形Button制作

在Button的Image中选择Source Image为Knob。

程序运行时，鼠标在矩形和圆形之间的区域，button还是会变成绿色。

所以，这种方法只是改变了Image的展示，但是并没有改变触发区域。

三、重写Image组件的触发区域

参考代码：新手问个可能很低级的问题，圆形按钮怎么做，uGUI默认都是矩形【unity3d吧】_百度贴吧

创建CustomCircleCollider脚本如下：

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

public class CustomCircleCollider : Image
{
	private CircleCollider2D circleCollider;

    protected override void Start()
    {
        base.Start();
        circleCollider = GetComponent<CircleCollider2D>();
    }


    public override bool IsRaycastLocationValid(Vector2 screenPoint, Camera eventCamera)
    {
        bool isRay = base.IsRaycastLocationValid(screenPoint, eventCamera);

        if(isRay && (circleCollider != null))
        {
            bool isTrig = circleCollider.OverlapPoint(screenPoint);
            return isTrig;
        }
        return isRay;
    }

}

我们把这个脚本挂载到button对象上，提示：

这是因为一个物体下只能挂载一个类型的组件一次，此时需要删除原来的Image组件（反勾选是没用的）。

然后：

（1）挂载CustomCircleCollider脚本到Button物体上，并修改Source Image的信息如下：

（2）添加Circle Collider 2D的组件，并编辑碰触区域。

运行程序，此时只有点击Button中的红色区域才会变绿。

collider的类型可以根据实际情况调整，比如换成Capsule collider等，这里只是演示效果。

四、注意事项

脚本中Start函数必须写成示例中的形式：

protected override void Start()

如果只是写成：void Start()，则会报如下的错误：

Warning CS0114 ‘CustomCircleCollider.Start()’ hides inherited member ‘UIBehaviour.Start()’. To make the current member override that implementation, add the override keyword. Otherwise add the new keyword.

这个提示我们必须重写Start函数。