Unity UGUI原理剖析

UI最重要的两部分

  1. UI是如何渲染出来的
  2. 点击事件如何触发
  3. 何时发生UI重绘

1:UI如何渲染出来的

UI渲染一定是有顶点的,没有顶点就没法确定贴图的采样,UGUI的顶点在一张Mesh上创建,经过渲染管线UI就渲染到屏幕上了,UI的渲染和3D模型的渲染本质上是没有区别的。

2:点击事件如何触发

UGUI里有个很重要的组件,EventSystem,还有一个非常重要的函数RaycastAll(),主要是获取目标。这个方法会首先获取所有的BaseRaycast对象,调用其Raycast方法,然后对最后得到的结果进行排序(大部分情况下按深度进行排序,也有一些情况下会使用距离、排序顺序)

所以结论就是UGUI的事件触发是通过射线实现的。

3:何时发生UI重绘

主动重绘

Rebuild方法是暴露出来的,但重绘的前提是有顶点数据或者材质球发生了变化才会发生重绘。如果你不想下一帧重绘,则可以主动调用,我目前没见过有主动调用的需求。

被动Tick重绘

被动重绘就很好理解了,因为UGUI的底层是每一帧都会检查是否有脏数据,如果有脏数据则会重新组装网格,并进入渲染流程。

相关推荐
雨季6662 小时前
Flutter 三端应用实战:OpenHarmony 简易“动态主题切换卡片”交互模式
flutter·ui·交互·dart
玖釉-3 小时前
深入浅出:渲染管线中的抗锯齿技术全景解析
c++·windows·图形渲染
淡海水4 小时前
【节点】[Houndstooth节点]原理解析与实际应用
unity·游戏引擎·shadergraph·图形·houndstooth
雨季6664 小时前
Flutter 三端应用实战:OpenHarmony 简易“动态色盘生成器”交互模式深度解析
开发语言·前端·flutter·ui·交互
雨季6664 小时前
Flutter 三端应用实战:OpenHarmony 简易“可展开任务详情卡片”交互模式深度解析
开发语言·前端·javascript·flutter·ui·交互
GIS小小研究僧4 小时前
如何使用Photoshop扣透明底电子签名
ui·photoshop
不会代码的小测试5 小时前
UI自动化-下拉选择框多级联动情况进行选择
前端·javascript·python·ui·自动化
不会代码的小测试6 小时前
UI自动化-下拉元素被隐藏无法直接进行select选择情况解决
前端·javascript·ui·自动化
雨季6666 小时前
Flutter 三端应用实战:OpenHarmony 简易“圆形进度启动屏”交互模式深度解析
开发语言·前端·javascript·flutter·ui·交互
熊猫钓鱼>_>7 小时前
【开源鸿蒙跨平台开发先锋训练营】Day 14: React Native开发鸿蒙应用第二阶段复盘——从功能实现到工程化实践的跨越
react native·ui·开源·harmonyos·arkts·鸿蒙·flatlist