当前位置: 首页 > news >正文

[unity 点击事件] 区域响应点击事件,排除子节点区域,Raycast Target 应用

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

  • UI点击穿透组件

http://www.mrgr.cn/news/96132.html

相关文章:

  • Android实践开发制作小猴子摘桃小游戏
  • 系统架构设计知识体系总结
  • 在 Linux(Ubuntu / CentOS 7)上快速搭建我的世界 MineCraft 服务器,并实现远程联机,详细教程
  • 给Web开发者的HarmonyOS指南01-文本样式
  • 数学-算法
  • Unity-RectTransform设置UI width
  • 生成模型速通(Diffusion,VAE,GAN)
  • 【更新中】【React】基础版React + Redux实现教程,自定义redux库和react-redux库
  • Mac 常用命令
  • @Resource 与 @Autowired:Spring 中的依赖注入注解大比拼
  • 前端全局编程和模块化编程
  • Android面试之基础算法总结
  • 01 设计模式和设计原则
  • MyBatis-Plus(SpringBoot版)学习第一讲:简介入门案例
  • vue vue3 走马灯Carousel
  • 高性能 Android 自定义 View:数据渲染与事件分发的双重优化
  • QT三 自定义控件,自定义控件的事件处理自定义事件过滤,原始事件过滤
  • 自动化测试selenium(Java版)
  • Java基础关键_029_线程(二)
  • Vue3 项目通过 docxtemplater 插件动态渲染 .docx 文档(带图片)预览,并导出