原创至上,移步请戳:(二)unity4.6Ugui中文教程文档-------概要-UGUI Canvas

UI系统允许您快速、直观地创建用户界面(Ui)。这是Unity的新 UI 系统的主要功能介绍。

一、UI Overview概要

在这篇概述中,我们就去通过 UI系统的基础知识。我们将开始介绍Canvas(画布)并将所有 UI 元素都放在里面,和使用Rect ToolRect Transform进行UI元素排版。然后我们来看看视觉元素像TextImage,和交互控件,如Button按钮和Slider滑块。

1、Canvas

Canvas画布是摆放容纳所有的 UI 元素的区域。画布是一个游戏对象上的某个Canvas component组件,所有的 UI 元素必须是这个画布的子对象。

当您想创建新的 UI元素,如Image,那么就单击菜单创建:GameObject > UI > Image或者Hierarchy面板中Create->UI->Image,同时一个画布也自动的创建,如果在场景中已经存在一个画布。那么新建的UI元素Image被创建之后就直接作为这早就存在的画布上。

画布区域被显示为一个矩形在场景视图中。这使得它易于定位 UI元素,在任何时候都可以看到,不需要有游戏视图。

画布上有一个Render模式设置:screen space(overlay/Camare) 或 world space,可以设置render方式。

1.1 Screen Space - Overlay

这种渲染模式下,在场景中UI元素被渲染在屏幕上。如果屏幕大小改变或更改了分辨率,画布上将自动更改大小,以很好的相匹配。

UI in screen space overlay canvas

1.2 Screen Space - Camera

这是类似于Screen Space - Overlay,但在这个渲染模式下,画布被放置在指定的Camera前的一个给定的距离上。通过这个指定的摄像机UI元素被呈现出来,这意味着Camera settings会影响到UI的显示。如果将相机设置为Perspective,UI元素将在perspective下被呈现,perspective失真数可以被控制通过设置观看的Camera Field大小。如果屏幕调整的大小或更改分辨率或相机锥范围变化,画布上将自动更改大小,以及相匹配。

UI in screen space camera canvas

1.3 World Space

此渲染模式下使画布在场景中表现任何其他对象。可以手动使用其Rect Transform来设置画布的大小,和UI元素将会呈现在其他对象的前面或后面在基于 3D 配置的场景中。这是对于所有Ui是有用的,他们是world space的一部分,有时也被引用为剧情接口。

UI in world space canvas

【转】(二)unity4.6Ugui中文教程文档-------概要-UGUI Canvas的更多相关文章

  1. [转](二)unity4.6Ugui中文教程文档-------概要-UGUI Canvas

    大家好,我是孙广东.   转载请注明出处:http://write.blog.csdn.net/postedit/38922399 更全的内容请看我的游戏蛮牛地址:http://www.unityma ...

  2. 【转】(八)unity4.6Ugui中文教程文档-------概要-UGUI Rich Text

    原创至上,移步请戳:(八)unity4.6Ugui中文教程文档-------概要-UGUI Rich Text 7.Rich Text UI元素和文本网格的文本可以合并多个字体样式和大小.对 UI系统 ...

  3. 【转】(七)unity4.6Ugui中文教程文档-------概要-UGUI Auto Layout

    原创至上,移步请戳:(七)unity4.6Ugui中文教程文档-------概要-UGUI Auto Layout 6. Auto Layout Rect Transform布局系统是足够灵活,可以处 ...

  4. 【转】(六)unity4.6Ugui中文教程文档-------概要-UGUI Animation Integration

    原创至上,移步请戳:(六)unity4.6Ugui中文教程文档-------概要-UGUI Animation Integration 5.Animation Integration(动画集成) 动画 ...

  5. 【转】(五)unity4.6Ugui中文教程文档-------概要-UGUI Interaction Components

    原创至上,移步请戳:(五)unity4.6Ugui中文教程文档-------概要-UGUI Interaction Components 4.Interaction Components 本节涵盖了处 ...

  6. 【转】(四)unity4.6Ugui中文教程文档-------概要-UGUI Visual Components

    原创至上,移步请戳:(四)unity4.6Ugui中文教程文档-------概要-UGUI Visual Components 3.Visual Components 有新的组件和游戏对象已添加到uG ...

  7. 【转】(三)unity4.6Ugui中文教程文档-------概要-UGUI Basic Layout

    原创至上,移步请戳:(三)unity4.6Ugui中文教程文档-------概要-UGUI Basic Layout 2. BasicLayout 在这一节我们会看到UI元素相对于画布的位置是怎样的. ...

  8. [转](六)unity4.6Ugui中文教程文档-------概要-UGUI Animation Integration

    5.Animation Integration(动画集成) 动画允许控件的所有状态之间相互转换,充分使用unity的动画系统.这是最强大的的转换模式的在处理很多属性的同时可以进行动画. 要使用动画转换 ...

  9. [转](五)unity4.6Ugui中文教程文档-------概要-UGUI Interaction Components

    大家好,我是孙广东.   转载请注明出处:http://write.blog.csdn.net/postedit/38922399 更全的内容请看我的游戏蛮牛地址:http://www.unityma ...

随机推荐

  1. JavaScript判断是否全为中文,是否含有中文

    来源于:http://blog.csdn.net/yenange/article/details/7463897 第一种代码(全为中文则返回"true",不全为中文则返回" ...

  2. NSDictionary的分类

    @implementation NSDictionary (extra) //根据key值的到字典中的object - (id)getObjectByKey:(NSString*)key { NSAr ...

  3. 从html加载json文件想起

    原文来自:https://www.cnblogs.com/dibaosong/p/4572274.html#top 文中给出了data.json文件内容 还给出了html文件内容 ok. 1.新建工程 ...

  4. jenkins 图文教程 下载 --》安装--》更改默认端口号,附自启动脚本

    参考文章: 1.http://www.ibm.com/developerworks/cn/java/j-lo-jenkins/ 2.http://blog.csdn.net/zhaolixin007/ ...

  5. scp的两种方式

    如果host A 与 host B建立了信任连接(B有A的public key),那么从A向B传送文件,或者从B上传回文件都可以省略密码.但是前提是命令是在A上执行的. 从A向B拷贝文件 on hos ...

  6. 超酷的 Vim 搜索技巧

    尽管目前我们已经涉及 Vim 的多种特性,但此编辑器的特性集如此庞大,不管我们学习多少,似乎仍然远远不足.承接我们的 Vim 教程系列,本文我们将讨论 Vim 提供的多种搜索技术. 不过在此之前,请注 ...

  7. SaltStack 入门到精通第三篇:Salt-Minion配置文件详解

    SaltStack 入门到精通第三篇:Salt-Minion配置文件详解 作者:ArlenJ  发布日期:2014-06-09 17:52:16   ##### 主要配置设置 ##### 配置 默认值 ...

  8. UAT测试后上线出现问题的引起的思考

    最近公司有一个外部项目上线了,虽然我没有参与这个项目,仅仅只是作为一个旁观者,但是关于用户的UAT测试的问题,不得表达下我的看法, 在上线之前进行了近一个月的UAT测试,测试完成后进入了正式上线阶段. ...

  9. php把采集内容中图片地址下载并替换成本地地址

    把字符串中地址全部获取到一个数组我们利用preg_match_all函数 代码如下 复制代码 <?php$str='<p><img border="0" s ...

  10. html5 audio组件禁止下载

    参考链接:https://wdd.js.org/audio-hide-download-icon.html 1. controlsList=”nodownload”// 这个方法只支持 Chrome ...