一个Unity3D UI界面布置的示例,界面菜单,UI,6m5m游戏素材
请求处理中...
一个Unity3D UI界面布置的示例使用UGUI实现的界面布局；其中包含了许多示例，请将参考。
或 10 积分 (）
下载53浏览人数11624交付方式直接下载
注意：【1】本站只是个免费分享平台，并不敢保证所有源码人人都能编译，因素太多，旨在学习研究，如果您有顾虑或斤斤计较就请不要下载了，大家都不容易，互相理解，才能让更多的好资源出现！【2】本站资源仅限于学习研究，请在下载后24小时内删除，不要用于任何商业用途。【3】部分素材压缩包因体积过大而上传到百度等网盘上，如果发现在本站下载的压缩包只要有几K大小，说明该压缩包里只是网盘的下载链接，并非文件损坏，本站的所有素材都是经过了审核，大家可放心下载，欢迎监督反馈。【4】做个好平台真心不容易，我们一直在努力，因本站素材量大，难免会出现某网盘下载链接失效等问题，请大家及时反馈，我们会及时修正保证您可以拿到素材，请大家支持和理解！
免责声明：本网所展示的素材与服务信息由买卖双方自行提供，其真实性、准确性和合法性由信息发布人负责。本网不提供任何保证，并不承担任何法律责任，如有不妥之处请及时反馈，本网将会妥善处理。
友情提醒：本站旨在游戏开发的学习，所分享的素材资源均来源于网络，仅适用于学习参考，尊重版权，禁止用于任何商业用途，否则后果自负，所展示的素材版权归原作者或公司所有，如果本站素材侵犯了您的权益，请联系我们，我们将及时处理。
猜您喜欢的游戏素材
0金币 / 个
0金币 / 个
0金币 / 个
0金币 / 个
1金币 / 个
1金币 / 个
1金币 / 个
0金币 / 个
1金币 / 个
0金币 / 个
好评率100%扫一扫，访问微社区
后使用快捷导航没有帐号？
签到成功!您今天第{todayrank}个签到，签到排名竞争激烈，记得每天都来签到哦！已连续签到:{constant}天，累计签到:{days}天
当前位置： &
查看: 3576|回复: 8
【蛮牛译馆】Unity 5.0中的框架调试器
本帖为抢楼帖，欢迎抢楼!&
72974/5000排名<font color="#FF昨日变化3主题帖子积分
日久生情, 积分 2974, 距离下一级还需 2026 积分
日久生情, 积分 2974, 距离下一级还需 2026 积分
蛮牛币2251
在线时间370 小时
马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。
才可以下载或查看，没有帐号？
Frame Debugger in Unity 5.0Unity 5.0中的框架调试器July 29, 2014 in Technology, Unity Products and Services by Aras Pranckevi?ius来自官方的博客
1.JPG (46.7 KB, 下载次数: 8)
15:34 上传
小编的话：官网又出新文章了，大家赶快过来看看啊，配合文字，有很多实用的图解啊。我挑出的关键词有（方便大家阅读）：框架调试器、帧、渲染、图像预处理。
& && &Have you ever looked at some graphics issue in Unity, and thought “if only I could see how the final frame is rendered, step-by-step?”. I know I do want that, all the time.
& && & 当你在Unity中发现一些关于图形的时，有没有过这种想法，“如果我能够看到最终这些框架，都是如何一步一步被渲染的，那该有多好啊！”反正我是一直想知道这问题的答案。
& && & You can achieve that with some external tools, especially if you’re on Windows. Build a standalone player, run it through Visual Studio graphics debugger, Intel GPA, RenderDoc, NVIDIA NSight orAMD GPU PerfStudio, then capture a frame of rendering, and step through the draw calls and other rendering events to see what’s going on.
& && & 你可以通过一些外部工具来实现这个想法，尤其当你用的是Windows平台时。首先创建一个独立播放器，在Visual Studio图形调试器、Intel GPA、RenderDoc、NVIDIA NSight或AMD GPU PerfStudio中运行，然后捕获一个正在渲染的框架，通过绘制调用和其他呈现事件，来了解当前的运行情况。
& && & The above is a very powerful approach, since these tools can provide you with a lot of information to really drill down. It’ you need to build a player and launch external tool.
& && & 以上所述的方法是非常强大的，因为这些工具能提供给你很多信息，帮助我们做深入研究。但同时这也是个复杂难懂的方法；你需要创建一个播放器，还需要运行其他外部工具。
& && & During one hack week we thought: “hey, can we build something really simple, but really quick to use in Unity?”… So we did.
& && & 在一次hack week（某个技术交流会）中，我们突然想到：“嘿，我们能不能在Unity中做出一个非常简单，但能够让大家快速上手的工具呢？”……然后我们就做了一个。
Enter Frame Debugger
进入框架调试器
& && & You select Frame Debugger from the Window menu and you see a list of draw calls made during that frame. Step through them and see what was rendered up to that point. Inspect shadow maps, temporary render textures, deferred g-buffer and whatnot.
& && & 你在Windows菜单中选择框架调试器后，你就能看到此帧运行期间，产生的一系列绘制调用。通过一步一步地查看，你就能看到进行到这步时，都有什么已被渲染了。还可以查看阴影贴图，临时的纹理渲染，g-Buffer延迟和诸如此类的东西。
2.JPG (24.12 KB, 下载次数: 8)
15:35 上传
& && & The UI for the frame debugger is pretty simple. There’s a tree of draw calls and other interesting events on the right and details about selected event on the left. Most draw calls display a mesh preview and highlight object being drawn in the hierarchy.
& && & 用户界面中的框架调试器还是比较简单的。右半部显示的是绘制调用的目录结构，以及其他有趣的事件。左半部是选中事件的详细信息。大部分绘制调用都会在网格预览中显示，选中的对象会拖入到层级中。
& && & Here we are stepping through the draw calls of depth texture creation, in glorious animated GIF form:
& && & 在此，我们用超炫的GIF动态动画格式，逐个查看深度纹理生成的绘制调用。
FrameDebugAnimDepth.gif (256 KB, 下载次数: 8)
15:37 上传
& && & And later on in the frame, a light is rendering it’s shadow map:
& && & 然后，在当前框架中，正在渲染一个灯它所对应的阴影贴图。
2321.gif (214.06 KB, 下载次数: 9)
15:39 上传
& && & Even later on, image post-processing effects start. You can see the bloom & flares effect downscaling the image, blurring it and adding it back, followed by a brief flash of a tonemapper:
& && & 再往后，图像预处理效果开始了。你能看到通过光晕效果，缩小了图片，也使图片变模糊，随后再添加回去，这过程也伴随着色调制图的一个短暂的闪烁。
marry.gif (196.5 KB, 下载次数: 9)
15:41 上传
Render target display options
渲染对象显示选项
& && & For some effects, it is convenient to see individual channels of a render target. Here’s a screenspace buffer produced by Unity’s directional light shadows:
& && & 对于某些效果，渲染对象的单个通道是很容易看到的。此处显示的是，在Unity平行光阴影作用下的屏幕空间的缓冲区：
3.JPG (18.26 KB, 下载次数: 8)
15:43 上传
& && & And here’s only the red channel displayed:
& && & 这里只显示了红色通道：
4.JPG (17.85 KB, 下载次数: 8)
15:43 上传
& && & The range of colors displayed can be tweaked via a Levels slider in the toolbar. This is particularly useful for HDR rendering:
& && & 我们可以通过工具栏中的Levels slider，来调节我们将要显示的图片的颜色范围。这个尤其适用于HDR渲染。
5.JPG (39.72 KB, 下载次数: 8)
15:44 上传
& && & When rendering into multiple render targets at once you can select which one to display in the game view. Shown here are the diffuse, specular, normals and emission/lighting buffers in 5.0 deferred shading mode, respectively:
& && & 如果需要同时对多个对象进行渲染，你可以在游戏视图中选择其一。下图显示的是在5.0延迟渲染模式中的漫反射、镜面反射、法线和自发光/光照缓存区。
6.JPG (49.47 KB, 下载次数: 8)
15:46 上传
Implementation notes
实现中的注意事项
& && & The current implementation of the Frame Debugger could be seen as a cute hack (we weren’t quite sure ourselves whether it would work at all). There’s no actual “frame capture” pretty much all we do is stop rendering after some number of draw calls. So if you’re looking at a frame that would have 100 objects rendered and you’re looking at object #10 right now, then we just skip rendering the remaining 90. If at that point in time we happen to be rendering into a render texture, then we display it on the screen.
& && & 我们可以把这次开发出来的框架调试器，看成是一个cute hack（刚开始连我们自己都不确信，这个调试器到底能不能正常工作）。其实，这里并没有真正进行的“框架捕获”；我们做的工作，只是在执行完一部分绘制调用后，停止渲染。因此，如果你现在看到的框架中，渲染好了100个对象，然后你希望看到其中的第十个渲染对象，那么我们就直接跳过后90个对象的渲染过程。如果在那个时间点，我们正好要进行纹理渲染，那么我们直接在屏幕上显示这个过程。
& && & This means the impl getting functionality working was only a few days of work(and then a few weeks iterating on the UI). The downsides of this approach is that it only works in the Editor. If actual rendering changes while you’re debugging the frame (e.g. you disable some objects, or resize game view), then you’ll suddenly start looking at a different list of draw calls. However, even with these limitations we think it can be a very useful tool for tracking down graphics issues in your games.
& && & 也就是说，这个工具实现起来其实并不难；功能的实现只需要几天的时间（但之后还需要几周的时间来不断改善UI）。该方法的一个弊端就是，这个工具只能在编辑器中运行。如果你在对某个框架进行调试过程中，产生了一些渲染变化（比如一些对象无效化了，或者你对游戏视图的大小进行了调整），那么你就会突然看到一些其他的绘制调用。虽然有这么多限制，我们还是认为，在追踪图像方面，这个调试器是一个非常实用的工具。
9.JPG (22.11 KB, 下载次数: 9)
15:47 上传
& && & Happy frame debugging!
& && & 祝你们框架调试愉快！
& && &&&译文： - OVATION
& && &&&我是的蛮牛译馆（一个专门翻译国外资料的组织）的一员，我会陆续整理，翻译国外相关的新闻资讯与技术文章，以及各种视频等内容。我们也欢迎热爱游戏翻译的好友加群，一起体验翻译并分享乐趣，QQ群号：。关于此篇文章翻译有错误的地方，欢迎大家指正。
& && &&&蛮牛译馆期待您的加入：&&
unity框架是什么意思;unity editor 已停止工作;unity 动态显示文字;gunity 框架;unity使用的是什么框架;unity editor 停止工作;显示动态文字unity bloom怎么用;games made with unity 5
每日推荐：
2127/150排名<font color="#FF昨日变化2主题帖子积分
初来乍到, 积分 127, 距离下一级还需 23 积分
初来乍到, 积分 127, 距离下一级还需 23 积分
蛮牛币1033
在线时间28 小时
本帖最后由 schwarzerengel 于
17:11 编辑
Most draw calls display a mesh preview and highlight object being drawn in the hierarchy.
大部分draw calls都会显示一个网格预览，同时将已被拖入到Hierarchy视图中所对应的对象高亮标记出来。
你这句话应该木有改吧……
第一次坐沙发……感动ing
每日推荐：
71951/5000排名<font color="#FF昨日变化主题帖子积分
日久生情, 积分 1951, 距离下一级还需 3049 积分
日久生情, 积分 1951, 距离下一级还需 3049 积分
蛮牛币1230
在线时间657 小时
期待5.0的破解版赶紧出来啊…………正版贵啊
每日推荐：
71651/5000排名<font color="#FF昨日变化主题帖子积分
日久生情, 积分 1651, 距离下一级还需 3349 积分
日久生情, 积分 1651, 距离下一级还需 3349 积分
蛮牛币3130
在线时间372 小时
Cool!!& && && && && && && && && && &
每日推荐：
5524/1000排名<font color="#FF昨日变化1主题帖子积分
熟悉之中, 积分 524, 距离下一级还需 476 积分
熟悉之中, 积分 524, 距离下一级还需 476 积分
蛮牛币1039
在线时间122 小时
又是楼主啊！！！！支持支持
每日推荐：
117/50排名<font color="#FF昨日变化130主题帖子积分
注册看看, 积分 17, 距离下一级还需 33 积分
注册看看, 积分 17, 距离下一级还需 33 积分
在线时间1 小时
看起来好六B 啊
每日推荐：
121/50排名<font color="#FF昨日变化130主题帖子积分
注册看看, 积分 21, 距离下一级还需 29 积分
注册看看, 积分 21, 距离下一级还需 29 积分
在线时间10 小时
好一个框架调试器，那应该叫帧调试器
每日推荐：
3158/300排名<font color="#FF昨日变化7主题帖子积分
偶尔光临, 积分 158, 距离下一级还需 142 积分
偶尔光临, 积分 158, 距离下一级还需 142 积分
在线时间25 小时
框架是什么一脸懵逼~
[]: iszhang 在网吧通宵，花了 1
每日推荐：
经过游戏蛮牛认证的蛮牛小翻译
社区QQ达人
使用QQ帐号登录论坛的用户> 博客详情
Unity终于在即将到来的4.6版本内集成了所见即所得的UI解决方案。事实上从近几个版本开始，Unity就在为这套系统做技术扩展，以保证最终能实现较理想的UI系统。本文试图通过初步的介绍和试用，让读者对这套系统有大体的了解，以便更进一步评估这套UI系统好不好用，适合用在什么项目。为了避免坑挖太深，更进一步的试用和评估我将在《》中进行论述。为论述方便，下文将这套New UI System简称为uGUI，并且以X-UI指代现有第三方UI插件。
（测试只针对Unity 4.6.0 beta 10，正式版可能会有所出入。目前Unity没提供文档，本人半桶水，欢迎群众在微博或Issues里吐槽！）
二、Rect Transform
Rect Transform继承自Transform，是uGUI相比X-UI最显著的区别[]。当你为Empty GameObject加入一个UI Component时，Transform会自动转换为Rect Transform。Rect Transform尽量整合了X-UI常见的anchor(相对父物体的锚点),&pivot(中点),&stretch(拉伸)等属性。值得一提的是，这里的anchor是Rect而非Vector2，因为它不仅用于偏移，而且用于缩放。点击Rect Transform上的准心图标，还能在弹出的Anchor Presets面板中对其进行快速设置。
这个面板还是不够直观，我们可以把它看成一张表，上面四个图标用于设置列，左边四个图标用于设置行，也可以直接点击里面的16个图标同时设置行和列。强大的地方是，按住shift时能同时设置pivot，这时能发现控件虽然不动但position已经在改变。如果按住alt，则设置anchor的同时设置position。如果shift和alt同时按住，那么你就能同时设置anchor, pivot和position。这个操作方式比起X-UI，真的高明很多，对多分辨率适配很有帮助。
除此之外，Rect Transform还提供了Blueprint和Lock Rect选项，前者用于对旋转过的元素进行定位，后者据说明是能在设置anchor时保持位置不变，暂时没搞明白。
uGUI可以直接在Hierarchy面板中上下拖拽来对渲染进行排序(支持程序控制)，越上面的UI会越先被渲染，相比X-UI的global depth排序，这样的拖拽设计很讨好用户。同时在结构上则和ex2D采用的local depth类似，这样GO只和同级其它GO进行排序，开发组件会很方便。需要注意的是，这里排序只是相对UI而言，其它3D物体还是按原先的次序渲染，并且UI总是渲染在3D物体上面。这就导致你不能像用ex2D那样直接将粒子系统插入到两个UI之间。
这种无需填写depth值的排序方式，容易导致没有手工做sprite packing的free版用户遇到draw call增加。因为所有物体的depth都是自动设置的，Unity保证了每个物体的depth都是唯一的。这时假设你有一个格子控件，每个控件用到了两个Sprite，但你并没有把Sprite都拼到同一张贴图上。于是你每复制一个新的格子出来，draw call就会增加2个，因为Unity会以格子为单位依次绘制。pro用户由于有sprite packing机制，不用担心这个问题。（这种情况在ex2D里，是以默认提供"unordered"的渲染方式来解决的，这也是NGUI的默认做法。在这种情况下ex2D会优先以相同depth的相同Sprite为单位绘制，因此不论有多少个格子，draw call都是2个。除非你就是希望以格子为单位进行渲染[]，那么你可以在ex2D里设置渲染方式为"ordered"，或者在NGUI里给每个格子设置不同的depth。
uGUI自带了以上控件，其中Image用于显示Sprite，Raw Image用于显示Texture，Image Mask和Rect Mask用于clipping。所有控件都是MonoBehaviour，可以直接从Inspector里拖到其它GameObject上。
uGUI用Image控件显示图片，图片就是一个Sprite，这意味着Pro用户不用再制作atlas了，相比X-UI是个大进步，Free用户一样可以手动做Packing。Image提供了Simple,&Sliced,&Tiled,&Filled四种效果，和X-UI保持一致。
4.2 Button
uGUI里，Button控件由两个GameObject组成，一个包含Image, Button等Component，一个包含Text等Component。这样设计很组件化，唯一的问题是当用户想修改Button时，容易不小心选中Label或其它实体。
Button Component主要执行Transition和事件两个操作。
Transition可选择改变颜色、更换贴图或自定义动画，使用起来简单方便，也能利用动画定义更丰富的表现。我会再写一篇文章演示Button的Transition。
事件也是所见即所得的，在OnClick里面可以添加多个命令，命令可以选择对应的目标、操作和参数。用法简单，有需要也可以换程序控制。
目标可以是任意Object，例如其它GameObject或者Project里的Asset
操作可以是需要设置的参数或调用的方法
参数分成Dynamic和Static，Dynamic能将控件的参数单向绑定到目标参数，Static则将目标参数设置成预设值。按钮没有Dynamic参数，Toggle, Slider等控件才有。
5.1 Event Trigger
uGUI控件往往只提供一个自带事件，要响应更多基本事件的话，需要添加Event Trigger组件。Event Trigger包含以下事件：
PointerEnter, PointerExit, PointerDown, PointerUp, PointerClick
Move, Drag, Drop, Scroll
KeyDown, KeyUp, Select, Deselect
可以在Event Trigger中Add多个事件，每个事件都可以添加多个命令，用法和控件自带事件一致。
5.2 Graphic Raycaster
每个Canvas都有一个Graphic Raycaster，用于获取用户选中的uGUI控件。多个Canvas之间通过设置Graphic Raycaster的priority来设置事件响应的先后次序。当Canvas采用World Space或Camera Space时，Graphic Raycaster的Block选项可以用来设置遮挡目标。
5.3 Event System
创建uGUI控件后，Unity会同时创建一个[]叫EventSystem的GameObject，用于控制各类事件。可以看到Unity自带了两个Input Module，一个用于响应标准输入，一个用于响应触摸操作。Input Module封装了对Input模块的调用，根据用户操作触发各Event Trigger。理论上我们可以编写自己的Input Module，用来封装各种外部设备的输入，只要加入Event System所在的GameObject就行。
Event System组件则统一管理多个Input Module和各种Raycaster。它每一帧调用多个Input Module处理用户操作，也负责调用多个Raycaster用于获取用户点击的uGUI控件以及2D和3D物体。
2D渲染分两大类，一类是单纯的Sprite绘制，用于渲染场景、角色、粒子等，另一类是UI绘制。Unity将这两类需求划分成了SpriteRenderer和uGUI两部分，前者由Transform&+&SpriteRenderer实现，后者由Rect Transform&+&CanvasRenderer&+&UI控件&+&Canvas[]实现，这样的两套相对独立的机制比起X-UI的UI控件继承自SpriteRenderer更为合理。因为在2D游戏里SpriteRenderer只需要关心最基本的面片渲染，注重效率，而UI注重各类变换、对齐、操作、动画，还常常需要Resize VBO。如果SpriteRenderer在设计上需要兼顾UI，就会像X-UI那样设计得太过复杂，在用户体验和性能上都很不好。
这里我们探讨一下uGUI的渲染机制，当我们渲染多个使用相同Sprite的控件时，并没发生dynamic batching，但是drawcall也没有上升。这就说明Unity在内部使用了专门的一套batching机制，把多个控件的VBO事先合并成了一个。也就是说CanvasRenderer不负责实际渲染，而是由Canvas批量渲染多个CanvasRenderer，这和部分X-UI采用的做法一致。这样单独batch的设计有可能使得性能比SpriteRenderer好，也可能导致性能更差。性能会更好的情况在ex2D里已经证实了，主要原因是这样能更好的平衡CPU和GPU负载，并且能做到更优化的batching算法。性能更差的情况，在去年旧版的NGUI测试时也遇到了，根本原因还是优化不到位导致的（不是贬低，不同工具的取舍和面向市场都不同）。而Unity的 SpriteRenderer在手机上的渲染跑分是和ex2D持平的，CanvasRenderer又比SpriteRenderer快[]，因此uGUI的性能不用担心。由于目前没有Mac版本，我会在正式版发布后进行一次手机跑分测试。
uGUI功能完善，操作简洁，很接地气。可以说uGUI是相对X-UI的全面升级，整体架构更为严谨，实现更为清晰。依托4.5的Module Manager，uGUI以Package的形式提供，也能获得快速的升级[]。作为ex2D v2.0开发者之一，我很看好它将来的发展，uGUI将在大多数场合取代X-UI。
初步感受：
RectTransform
Event/单向数据绑定
直接在Hierarchy中排序
Pro用户可用Sprite的动态拼图，无需手工拼图
7.3 小遗憾
Anchor Presets面板还不够直观。
用户想修改Button时，很容易修改到Label。
当Hierarchy面板内的目标节点展开子节点后，无法将其它节点直接拖动到目标的正下方。
7.4 小问题
Input组件对方向键的支持有问题。
Game View dock到主窗口后，top定位有误，把toolbar的高度也算进去了。
我们在其它平台上开发类 Entity-Component框架时，讨论过Unity为什么不在底层对transform做特殊处理，以避免插件作者手工缓存transform来优化query transform引起的开销，甚至是将transform直接整合进GameObject。原因是现在的transform是3D的，将来完全可能推出 2D Transform。所以Unity在之前的版本里一直保留着transform的独立性。
我不能完全肯定一定是Canvas，但通过Canvas和CanvasRenderer的接口来看，这个可能性很大。
基于更好的平衡CPU和GPU负载 + 更优化的batching算法，以Unity的实力CanvasRenderer超越SpriteRenderer问题不大。而且如果性能不会提升，uGUI只要像2D Toolkit那样给每个控件直接添加MeshRenderer，也就是说uGUI直接用已有的SpriteRenderer就好，不太可能加入新的CanvasRenderer性能反而更慢。
Unity允许多个Event System同时存在，但同一时刻只有一个能够生效。
uGUI的控件、Event等模块以包的形式提供，位于程序目录下的%UNITY%\Editor\Data\UnityExtensions\Unity\GUISystem\4.6.0，Unity 提供了两个运行时版本的DLL，分别用于创作和发布。区别主要是发布版不含一些Editor中才用得到的代码。由于DLL没办法通过预编译符号来进行条件编译，因此Unity使用这种方式进行权衡，用户发布时无需手工切换DLL版本，满足了闭源，又兼顾了执行效率。这样就甩开了第三方插件几条街，很多插件在这个问题上不是牺牲性能就是无奈开源。
有时还是会需要以格子为单位渲染，例如当格子之间需要重合，这种需求在UI里不常见。关注游戏葡萄
微信扫描二维码关注
游戏葡萄公众号
的其他文章
的其他文章
的其他文章
TalkingData
的其他文章
的其他文章
的其他文章
的其他文章
的其他文章
的其他文章
All Rights Reserved
赞助Sponsor
赞助Sponsor
阅读Articles
数据库Data
数据库Data
招聘Recruitment
联系我们Contact
友情链接Links
游戏葡萄订阅号1.判断是否点击 UGUI界面:
using UnityE
using System.C
using UnityEngine.UI;
using UnityEngine.EventS
public class UiClickTest : MonoBehaviour {
// Use this for initialization
void Start () {
// Update is called once per frame
void Update () {
if (Input.GetMouseButtonDown(<span style="color: #)) {
if (EventSystem.current.IsPointerOverGameObject()) {
Debug.Log("点击到UGUI的UI界面，会返回true");
Debug.Log("如果没点击到UGUI上的任何东西，就会返回false");
2.判断是否点击了NGUI界面:
void OnClick ()
// NGUI 3.8之前 点击空白地方返回为null
// NGUI 3.8之后 点击空白地方返回为UIRoot
if (UICamera.hoveredObject.name != "UIRoot")
Debug.Log ("我现在点击的不是空白");
void Update()
// 返回值是bool变量，如果鼠标在UI上返回true（记得加碰撞器）
Debug.Log(UICamera.Raycast(Input.mousePosition));
阅读(...) 评论()