首页 > Unity3D频道 > 【Unity杂文】 > [投稿]Unity3D游戏优化之头顶UI
2017
04-10

[投稿]Unity3D游戏优化之头顶UI

3D角色头顶会显示文字、图标、血条等,它会跟随角色移动,始终朝向相机,可能还有定制的缩放,一般情况下会考虑用UGUI来做,但完成后发现这样做的效率很低,而且遮挡正确性也保证不了。

效率低因为:

1,渲染上每块文字、图片都要用一次drawcall,图片文字又可能是交替出现的没法利用dynamic batching,UGUI的渲染顺序是hierachy从上到下,基本上必然交替出现。一个角色头顶UI就可能要1至5+个drawcall,比角色自身的还多。

2,UGUI的元素都要放到canvas节点下,同步位置、朝向、缩放是很大的消耗,同时会触发canvas重新刷新UI的vertex buffer,虽然是在其他线程上刷新的,但仍然很慢。如果每个头顶UI都配一个canvas挂载角色节点下,实测发现性能更差。下图是100个角色头顶有图标和名字的profiling,可以看到同步pose比整个游戏的渲染还高

[投稿]Unity3D游戏优化之头顶UI - 雨松MOMO程序研究院 - 1

遮挡不正确因为:头顶UI属于透明物体,需要从远到近渲染,但是UGUI是根据Hierachy从上到下的,没法根据远近排序,这就会造成远处角色的头顶UI挡住自己角色的,看着别扭,尤其在自由视角的游戏中。

想要效率高必须得在一个drawcall里渲染图文,且能用到dynamic batching,dynamic batching是在渲染线程上进行的还能省主线程时间。不用UI而是当作一般3D物体渲染就能用到引擎的透明排序正确遮挡。

Unity自带的TextMesh可以做到遮挡正确,但是没法同时渲染图文,也没代码可改,所以pass。

Asset Store上找下插件

TextMeshPro是很强大的插件,用SDF(signed distance field有向距离场)的方式使放大的文字锐利很多,但是不支持动态字体,只能是预先生成的bitmap里固定的字,无法满足常用汉字之外的显示,又pass。以后可以说下SDF渲染文字的原理。

SuperTextMesh:能渲染动态文字,富文本支持图文混排,缺点是支持atlas但很弱,资源管理、解析效率内存占用都算不上优秀。好在有源码可以改,就选这个了。

 

一个drawcall同时渲染图文的方式就是用混合,一个材质带文字和atlas两张贴图,用3套uv进行混合,uv1是文字的,uv2是图片的,uv3表示混合权重,显示文字的quad文字权重为1图片为0,显示图片的quad文字权重为0图片权重为1,sample两张图混合一下就行了。

性能比之前好很多,下面是2001个带图文的SuperTextMesh,2000个在时刻改变位置。合批到了4个drawcall,更新pose的脚本消耗有数量级的降低。

[投稿]Unity3D游戏优化之头顶UI - 雨松MOMO程序研究院 - 2

[投稿]Unity3D游戏优化之头顶UI - 雨松MOMO程序研究院 - 3

[投稿]Unity3D游戏优化之头顶UI - 雨松MOMO程序研究院 - 4

[投稿]Unity3D游戏优化之头顶UI - 雨松MOMO程序研究院 - 5

策划想要的图文基本都能搞定。国内挺多游戏在优化的时候都会发现是UI的瓶颈,UWA的专家们也说见怪不怪了:D

 


感谢 燃野 投稿  https://zhuanlan.zhihu.com/p/25670078

最后附带招聘贴

北京上市游戏公司招聘客户端程序员,手机MMO项目,负责功能逻辑、战斗逻辑,渲染、工具、底层框架其中的一至多项。

要求编程、数据结构、操作系统方面有扎实的基础,聪明好学仔细认真,擅长团队协作,沟通顺畅对事不对人,有相关项目经验或图形学、编辑器开发等特长尤佳。

公司待遇福利不错,项目组有很多高手,公司也有技术积累,有意者站内信联系。

本人邮箱: yesbaba艾特qq点坑

感谢 燃野 投稿  https://zhuanlan.zhihu.com/p/25670078

最后编辑:
作者:雨松MOMO
专注移动互联网,Unity3D游戏开发
捐 赠写博客不易,如果您想请我喝一杯星巴克的话?就进来看吧!

[投稿]Unity3D游戏优化之头顶UI》有 3 条评论

  1. 珍蜗蜗 说:

    雨松大神,我创建了两个一模一样的text,batch是2,没有合批。看到代码里的AsMaterial()每次都会new 一个material,如果我把这里改成直接用默认的,batch就会变成1。是这里需要我们自己改吗?

    • 雨松MOMO 说:

      它这个原理就是用2套UV 一套是给字 一套是给图 然后通过一个shader将两个不同的图画出来, 其实没必要用这个插件, 根据原理可以做出来。

  2. bafal 说:

    有没有源码?

留下一个回复

你的email不会被公开。