UI点击事件
UGUI的事件本质上就是发送射线，由于UI的操作有一些复杂的手势，所以UGUI帮我们又封装了一层。创建任意UI时都会自动创建EventSystem对象，并且绑定EventSystem.cs和StandaloneInputModule.cs如下代码所示，EventSystem会将该对象绑定的所有InputModule脚本收集起来保存在SystemInputModules对象中。
然后在EventSystem的Update()方法中更新它们，通常情况下我们只需要一个StandaloneInputModule即可。
当存在可执行的Module 会调用它的m_CurrentInputModule.Process();方法。那么UI是如何确定出点击到那个元素上的呢？如下代码所示，在EventSystem中遍历所有module.Raycast()方法。
EventSystem.cs（部分代码）
public class EventSystem : UIBehaviour
{
//...略
public void RaycastAll(PointerEventData eventData, List<RaycastResult> raycastResults)
{
raycastResults.Clear();
//获得当前激活状态下每个Canvas上绑定的GraphicRaycaster的对象
var modules = RaycasterManager.GetRaycasters();
for (int i = 0; i < modules.Count; ++i)
{
var module = modules[i];
if (module == null || !module.IsActive())
continue;
//开始发送射线
module.Raycast(eventData, raycastResults);
}
//对发送射线的结果进行排序，保证在前面的UI优先处理
raycastResults.Sort(s_RaycastComparer);
}
private static readonly Comparison<RaycastResult> s_RaycastComparer = RaycastComparer;
private static int RaycastComparer(RaycastResult lhs, RaycastResult rhs)
{
if (lhs.module != rhs.module)
{
var lhsEventCamera = lhs.module.eventCamera;
var rhsEventCamera = rhs.module.eventCamera;
if (lhsEventCamera != null && rhsEventCamera != null && lhsEventCamera.depth != rhsEventCamera.depth)
{
// 比较camera的深度
if (lhsEventCamera.depth < rhsEventCamera.depth)
return 1;
if (lhsEventCamera.depth == rhsEventCamera.depth)
return 0;
return -1;
}
//比较射线结果的排序优先级
if (lhs.module.sortOrderPriority != rhs.module.sortOrderPriority)
return rhs.module.sortOrderPriority.CompareTo(lhs.module.sortOrderPriority);
//比较射线结果的渲染优先级
if (lhs.module.renderOrderPriority != rhs.module.renderOrderPriority)
return rhs.module.renderOrderPriority.CompareTo(lhs.module.renderOrderPriority);
}
if (lhs.sortingLayer != rhs.sortingLayer)
{
// 比较SortingLayer
var rid = SortingLayer.GetLayerValueFromID(rhs.sortingLayer);
var lid = SortingLayer.GetLayerValueFromID(lhs.sortingLayer);
return rid.CompareTo(lid);
}
//比较sortOrder
if (lhs.sortingOrder != rhs.sortingOrder)
return rhs.sortingOrder.CompareTo(lhs.sortingOrder);
//比较深度
if (lhs.depth != rhs.depth)
return rhs.depth.CompareTo(lhs.depth);
//比较距离
if (lhs.distance != rhs.distance)
return lhs.distance.CompareTo(rhs.distance);
//最后比较index
return lhs.index.CompareTo(rhs.index);
}
}
还记得每个Canvas要想监听点击事件必须绑定GraphicRaycaster脚本吗？上面代码中的RaycasterManager.GetRaycasters();方法就是获取当前到底有多少个绑定GraphicRaycaster脚本的对象，那么同时参与点击事件的Canvas越多效率也就越低了，游戏中有很多界面是叠在一起的，最上面的界面已经挡住了所有界面，但是由于下面的界面还有GraphicRaycaster对象，那么必然产生额外的计算开销，所以这种情况可以DeActive不需要参与点击事件的Canvas。
最后我们来看看到底如何判断点击的事件的，如下代码所示，首先遍历Canvas下每一个参与渲染的Graphic对象，如果勾选了raycastTarget并且点击射线与它们相交，此时先存起来。
由于多个UI有相交的情况，但由于Mesh都合批了第一个与射线相交的对象是没有意义的，但是我们只需要响应在最上面的UI元素，这里只能根据depth来做个排序了，找到最上面的UI元素，最后再抛出正确的点击事件。
GraphicRaycaster.cs(部分代码)
public class GraphicRaycaster : BaseRaycaster { //...略 [NonSerialized] static readonly List<Graphic> s_SortedGraphics = new List<Graphic>(); private static void Raycast(Canvas canvas, Camera eventCamera, Vector2 pointerPosition, IList<Graphic> foundGraphics, List<Graphic> results) { //遍历，将每个参与渲染的UI添加到s_SortedGraphics对象中。 int totalCount = foundGraphics.Count; for (int i = 0; i < totalCount; ++i) { Graphic graphic = foundGraphics[i]; if (graphic.depth == -1 || !graphic.raycastTarget || graphic.canvasRenderer.cull) continue; if (!RectTransformUtility.RectangleContainsScreenPoint(graphic.rectTransform, pointerPosition, eventCamera)) continue; if (eventCamera != null && eventCamera.WorldToScreenPoint(graphic.rectTransform.position).z > eventCamera.farClipPlane) continue; if (graphic.Raycast(pointerPosition, eventCamera)) { s_SortedGraphics.Add(graphic); } } //根据depth开始对它进行排序 s_SortedGraphics.Sort((g1, g2) => g2.depth.CompareTo(g1.depth)); totalCount = s_SortedGraphics.Count; //最后将排序过的正确顺序保存起来 for (int i = 0; i < totalCount; ++i) results.Add(s_SortedGraphics[i]); s_SortedGraphics.Clear(); } }
所以说GraphicRaycaster组件越多越卡，raycastTarget勾选的越多越卡，其实开发中很多UI是不需要响应点击事件的，但是却被无意地勾选上了。这里我提供一个我开发的经验，如下图11-1所示，我会在Scene界面中将所有勾选过raycastTarget的对象用蓝色矩形框标记出来，这样做UI的人可以很方便地看到，如果有不需要参与点击的UI元素，那么就及时取消勾选吧。