当我打开一个二级弹窗后,希望可以通过点击弹窗以外的区域来关闭该弹窗。一开始我是在弹窗主节点上挂载了一个 button 组件,该 button 注册的点击事件中关闭该弹窗。在子节点(一个背景图)的image组件上启用 Raycast Target 选项,希望拦截点击事件,使得该背景图区域不会触发关闭按钮的事件。但是实际表现上,在该区域仍然可以触发主节点上的 button 点击事件。
查了各种资料,加上各种尝试,发现了两种解决办法。
第一种方案,是主节点不用 button 来响应关闭事件,而是继承 IPointerClickHandler,重写 OnPointerClick 方法来响应点击事件,在响应函数中检查点击区域是否在子节点区域外,在区域外才执行关闭逻辑。这种方法可行,但是不优雅。
第二种方案,是将 button 挂载到子节点同层级的 object 上,而不是直接放在主节点上。通过尝试,发现取消 Raycast Target 选项时,点击 imgBg 时会穿透使得 bgMask 上的 button 响应。勾上 Raycast Target 选项后,不再穿透。从这里可以看出,Raycast Target 选项对于同级对象,只有最上层对象会响应点击,但是为了让点击事件能传递下去,该选项不会阻止下层节点的响应。
参考链接: