Sprite和UI Image的区别
Unity3D最初是一个3D游戏引擎,而从4.3开始,系统加入了Sprite组件,Unity也终于有了2D游戏开发的官方解决方案。4.6更是增加了新的UI系统uGUI,使得使用Unity开发2D游戏效率非常高。
那么对于从事2D游戏开发的同学来说,想必都曾经遇到过2D元素渲染的选择问题。大家都知道,Unity可以将导入的图片分割为若干Sprite,然后通过SpriteRenderer组件或者uGUI的Image组件来渲染。一般情况下,两者的显示效果是一致的。那么究竟该使用哪个组件呢?
首先分析下两者的异同。
使用上,两者区别不大,都是使用一个Sprite源进行渲染,而Image需要位于某个Canvas下才能显示出来。场景中的Sprite可以像普通的3D游戏物体一样对待,通过Transform组件进行移动等操作,而Image则使用RectTransform进行布局,以便通过Canvas统一管理。由于RectTransform可以设置大小、对齐方式等,Image可以说更加方便一点,这也是很多人选择使用Image的原因。
渲染上,Sprite使用SpriteRenderer组件渲染,而Image则由CanvasRenderer组件渲染。两者在视觉上没有任何区别(都使用默认材质时)。它们默认的渲染也都是在Transparent Geometry队列中。
而在引擎的处理上,两者则有很大的不同。将Wireframe选项打开然后在场景中观察,就可以清楚地发现,Image会老老实实地为一个矩形的Sprite生成两个三角形拼成的矩形几何体,而Sprite则会根据显示内容,裁剪掉元素中的大部分透明区域,最终生成的几何体可能会有比较复杂的顶点结构。
那么这种不同会造成什么结果呢?在继续之前,我们先回顾一下游戏中每帧的渲染过程。对任何物体的渲染,我们需要先准备好相关数据(顶点、UV、贴图数据和shader参数等等),然后调用GPU的渲染接口进行绘制,这个过程称作Draw Call。GPU接收到DrawCall指令后,通过一系列流程生成最终要显示的内容并进行渲染,其中大致的步骤包括:
CPU发送Draw Call指令给GPU;
GPU读取必要的数据到自己的显存;
GPU通过顶点着色器(vertex shader)等步骤将输入的几何体信息转化为像素点数据;
每个像素都通过片段着色器(fragment shader)处理后写入帧缓存;
当全部计算完成后,GPU将帧缓存内容显示在屏幕上。
通过上面的认知,我们可以推断:
Sprite由于顶点数据更加复杂,在第1/2步时会比Image效率更低;
Sprite会比Image执行较多的顶点着色器运算;
Image会比Sprite执行更多的片段着色器运算;
看起来似乎Image比Sprite有更大的好处,然而事实上,由于片段着色器是针对每个像素运算,Sprite通过增加顶点而裁剪掉的部分减少了相当多的运算次数,在绝大多数情况下,反而比Image拥有更好的效率 —— 尤其是场景中有大量的2D精灵时。
总结一下,SpriteRenderer会创建额外的几何体来裁剪掉多余的透明像素区域,从而减少了大量的片段着色器运算,并降低了overdraw;而Image则会创建简单的矩形几何体。随着2D元素数量的增加,这种差别会慢慢明显起来。
可以看出,SpriteRenderer确实是经过优化以显示更多的元素的。所以在2D游戏开发中,游戏场景中的元素,应该尽量使用它去渲染。而Image应该仅用于UI显示(实际上即使不考虑性能原因,由于屏幕分辨率的变化,Image可能会被Canvas改变显示位置和实际大小,如果用于游戏内元素的显示,可能会造成跟预期设计不一致的显示结果,也应该避免使用)。
Sprite和UI Image的区别的更多相关文章
- 前端,后端,UI,UE,UX,区别到底在哪里?
前端后端,到低区别在哪里? 其实后端是负责更为复杂的数据逻辑,表处理结构,如何实现一连串的数据提交,包括,数据验证,数据影响,数据计算,数据提取,,,等等. 那么前端负责的是什么呢?数据展示,数据验证 ...
- 前端UI框架选择区别对比推荐
UI选择务必慎重,货比三家. 弱水三千只取一瓢:弱水三千只取一瓢,源起佛经中的一则故事,警醒人们在一生中可能会遇到很多美好的东西,但只要用心好好把握住其中的一样就足够了 老牌构建于jQuery框架之上 ...
- UI设计师与VI设计师的区别
企业视觉形象(CorporateVisualImage)与企业视觉形象识别(VI)并不是一个概念.前者是企业与生俱来的客观存在要素,也就是说一个企业无论是否制定了它的VI,也无论其所制定的VI是否成功 ...
- 实战开发中UI资源制作标准
资源制作标准设定建议 1.所有的UI资源全部采用PNG导出 因为Unity不支持外部压缩,所以,不论是用PNG还是JPG,只要尺寸相同,资源量在引擎中都会是一样大.所以,可以大胆地采用PNG进行输出, ...
- Google+ 团队的 Android UI 测试
https://github.com/bboyfeiyu/android-tech-frontier/tree/master/android-blog/Google%2B%20%E5%9B%A2%E9 ...
- 什么时候必须使用UI相机? 多个相机的作用原理?
首先,要从主画布说起,maincanvas,这个有什么限制?主画布是一张默认用来绘制UI的地方,这些UI必须是系统提供的UI组件,在画面下挂一个3D物体或非UI的2D物品是不会被绘制到画布上的,但是仍 ...
- NGUI: Next-Gen UI 2018.3.0f
https://assetstore.unity.com/packages/tools/gui/ngui-next-gen-ui-2413 NGUI is a very powerful UI sys ...
- 一种新的UI测试方法:视觉感知测试
什么是视觉测试 视觉测试(Visual Testing),主要检查软件用户界面(UI)是否正确显示给所有用户.它检查网页上的每个元素的形状.大小和位置是否符合预期,还检查这些元素是否在不同的设备和浏览 ...
- web前端面试题总结
HTML Doctype作用? 严格模式与混杂模式如何区分?它们有何意义? (1).<!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前.告知浏览器的解析 ...
随机推荐
- JIT编译器
深入理解Java Class文件格式(九) http://blog.csdn.net/zhangjg_blog/article/details/22432599 http://blog.csdn.ne ...
- angular学习笔记(二十二)-$http.post
基本语法: $http.post('url',{},{}).success(function(data,status,headers,config){ }).error(function(data,s ...
- angular学习笔记(五)-阶乘计算实例(2)
<!DOCTYPE html> <html ng-app> <head> <title>2.3.3计算阶乘实例2</title> <m ...
- DNS劫持和DNS污染
DNS劫持和DNS污染1.DNS劫持通过劫持DNS服务器,修改解析记录,导致对域名的访问转入虚假IP,结果是网站访问失败,窃取资料. 2.DNS污染使用虚假的DNS服务器,伪装成目标域名的解析服务器, ...
- 转载:[Mitbbs]FB的intern和准备的经历
今天中午刚收到f家的intern offer, 超级开心.在这个版块看了很多也收获很多. onsite前天晚上面就就对自己过了一定发个帖跟需要的人分享下自己的经历.论坛上帖 子看了很多,很多拿了FLA ...
- Jar/War/Ear等包的作用与区别详解
以客户角度来看,jar文件就是一种封装格式,用户不需要知道jar包中有多少个.class格式的文件及每个文件中的功能与作用,也可以得到相应的访问的结果.java中除了jar格式还有war和ear等包文 ...
- R ggplot2 线性回归
摘自 http://f.dataguru.cn/thread-278300-1-1.html library(ggplot2) x=1:10y=rnorm(10)a=data.frame(x= x, ...
- ucenter通信失败和不能登录的解决
对于ucenter真是让人不省心,修改一下url,就通信失败了. 1.通信失败 然后后来怎么也改不好了,后来一步一步打log,发现是uc_server和uc_client不一致. 检查uc_serve ...
- 【WPF】样式与模板:鼠标移入/悬浮时按钮的背景色不改变
情况:鼠标移到按钮上,默认情况是按钮背景色会改变的,网上也能搜到很多如何自定义改变的背景色. 需求:现在需求反过来,想要鼠标移到按钮上,保持按钮的背景色不改变. 一种思路:在样式文件中,使用Multi ...
- http抓包工具
fiddler 可以用该工具抓包并修改对应的参数数据