【Unity基础】ugui画布篇(个人学习)

这篇具有很好参考价值的文章主要介绍了【Unity基础】ugui画布篇(个人学习)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前言

ui是必学的东西,这里主要学习ugui的常用控件,而学习必须要养成查看源码的好习惯。。。。
知识参考:https://docs.unity3d.com/cn/2021.3/Manual/
提前说明,这是个人学习笔记,不是教程。

一、Canvas是什么?

Canvas故名思意就是UI的画板,主要是控制UI的绘制的。在unity的ugui中,所有UI都必须是Canvas的子物体,而一个Canvas对象必须挂上以下几个组件,Canvas组件、RectTransform组件、CanvasScaler组件、GraphicRaycaster组件。下面分别看看这些组件是干嘛的。顺便附上一张截图
【Unity基础】ugui画布篇(个人学习)

1.Canvas组件

I.RenderMode字段,是控制UI的覆盖方式,主要是三个选项。

选项一,Screen Space - Overlay

  按照选项的英文自己翻译,屏幕空间覆盖,那就是不管三七二十一直接覆盖上屏幕上。就是说把UI层和世界空间层分开渲染,UI永远是最前面的那个。

选项二,Screen Space - Camera

  如果选择这选项,就把把UI成发到摄像机的观察空间了。比如说我们选择好摄像机并且把设置好和摄像机的距离,如图所示:
【Unity基础】ugui画布篇(个人学习)
这里的意思是说,把UI发到摄像机朝向发现距离为100的地方处,但是我们以摄像机朝向距离为10的地方创建一个物体,那么这个物体就会对UI进行遮掩。如下图所示:
【Unity基础】ugui画布篇(个人学习)
,还有一个问题就是,这个UI的显示是依赖于摄像机的投影矩阵的,就是说选择摄像机的正交模式的情况下,UI的所有的近大远小的效果都会失效。

选项三,World Space

  这个选项就是把Canvas放到世界坐标里面,那么这种情况和普通的世界空间的其他物体没上面区别,那么我们可以把Canvas作为某个物体的子物体,就可以实现以下的效果。【Unity基础】ugui画布篇(个人学习)
这样就可以实现类似怪物头顶血条的效果了。。。。。。。

II.Pixel Perfect的作用

是Canvas组件下的这个东西
【Unity基础】ugui画布篇(个人学习)
它在RenderMode为 World Space的时候无法使用,开启它主要是然UI的边缘更加清晰化,当然,这是要消耗性能为代价的。

III.需要注意的问题

首先先创建一张图片和一个Cube,并且按照上面这种情况,发现UI层就会把游戏物体给挡住,如下图所示:
【Unity基础】ugui画布篇(个人学习)
我们再点开Cube的shader代码,发现如下图说是,Cube的着色器是开启着深度测试的,那么Image把Cube的遮挡部分的像素会因为无法通过深度测试而被剔除掉,所以就不会产生overdraw,这种情况下还可以接受,Cube的stand shader如下:
【Unity基础】ugui画布篇(个人学习)
深度测试的数值通常是无法提前预知的,所以Cube的一些像素是必需要通过片元着色器而通向测试部分的,不过我们倒是可以通过生成一张帧缓存,而提前知道屏幕的该像素点是UI的区域,且还需要判断该UI透不透明,如果满足不透明且是UI的区域而提前把Cube的像素在片元着色器阶段剔除掉。(这里只学习UGUI,超纲了😝)。

那么当我们创建两个Image并且在scene面板里打开overdraw模式的时候,发现两张image重叠处会有点亮,如下图所示:
【Unity基础】ugui画布篇(个人学习)
【Unity基础】ugui画布篇(个人学习)
再开UI默认的着色器,如下图。
【Unity基础】ugui画布篇(个人学习)
发现UI默认的着色器是把深度测试关上的,这意味着,重叠部分的像素,我们的显卡对它进行了两次渲染,那么在开发UI的过程中需要时时刻刻避免这种情况的发生。比如上层UI打开的时候下层禁用掉。

2.CanvasScaler组件

英文直译,画布缩放器。故名思意就是控制画布的大小被改变时,画布的UI要如何改变,这个组件主要是用于制作UI的自适应。

I.UI Scale Mode的选项

选项一. Constant Pixel Size

该选项是,无论屏幕大小如何改变,UI元素都只保持系统的像素大小。而这个选项。(几乎所有的UI适配都是使用这个选项的)
这个选项下产生的Scale Factor属性,主要用于缩放UI时,需要采用的这个系数再进行缩放操作。

选项二.Scale With Scree Size

这个选项下,屏幕越大,UI元素也跟着越大。并且可以通过如下图红框里三个参数做一些趋势性的操作。比如屏幕变大,由上面的匹配值来判断修改UI的宽度、高度的权重值。(这个模式也很少使用)
【Unity基础】ugui画布篇(个人学习)

选项三.Constant Physical Size

无论屏幕大小和分辨率如何,UI 元素都保持相同的物理大小。(这个模式几乎不用)

该组件与RectTransform组件的共同作用

可以直接翻看这篇文章,讲的相当不错:https://www.jianshu.com/p/dbefa746e50d
看完上面这篇文章完全就可以使用代码来进行UI适配了。。。。。。
在详细点可以查看unity的官方手册:https://docs.unity3d.com/cn/2021.3/Manual/script-CanvasScaler.html文章来源地址https://www.toymoban.com/news/detail-404738.html

到了这里,关于【Unity基础】ugui画布篇(个人学习)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【学习笔记】Unity基础(七)【uGUI基础、利用render Texture实现小地图功能】

    转载请注明出处:🔗https://blog.csdn.net/weixin_44013533/article/details/130808689 本篇基本是大纲性质,参考价值不大,只有最后一小节“利用render Texture实现小地图功能”花了点时间,可以看看,不过也用到了上面的canvas、UI image等知识、以及input等脚本功能,也算一个小练手吧 倒是

    2024年02月08日
    浏览(47)
  • Unity UGUI3——三大基础控件

    ​ Image 是图像组件,是 UGUI 中用于显示精灵图片的关键组件 ​ 除了背景图等大图,一般都使用 Image 来显示 UI 中的图片元素 Source Image:图片来源 图片类型必须是“精灵 Sprite”类型 Color:图像的颜色 Matreial:图像的材质 一般不修改,会使用 UI 的默认材质 Raycast Target:是否

    2024年02月09日
    浏览(53)
  • Unity UGUI1——基础组件概述

    ​ UGUI 是 Unity 引擎内自带的 UI 系统,官方称之为:Unity UI ​ 是目前 Unity 商业游戏开发中使用最广泛的 UI 系统开发解决方案 ​ 它是基于 Unity 游戏对象的 UI 系统,只能用来做游戏 UI 功能 ​ 不能用于开发 Unity 编辑器中内置的用户界面 ​ Unity 最初版本 ~ Unity4.6 版本: ​

    2024年02月10日
    浏览(40)
  • Unity技术手册-UGUI零基础详细教程-Canvas详解

    点击跳转专栏=Unity3D特效百例 点击跳转专栏=案例项目实战源码 点击跳转专栏=游戏脚本-辅助自动化 点击跳转专栏=Android控件全解手册 点击跳转专栏=Scratch编程案例 点击跳转=软考全系列 点击跳转=蓝桥系列 专注于 Android/Unity 和各种游戏开发技巧,以及 各种资源分享 (网站、

    2024年02月08日
    浏览(42)
  • Unity技术手册-UGUI零基础详细教程-Image图片

    往期文章分享 点击跳转=《导航贴》- Unity手册,系统实战学习 点击跳转=《导航贴》- Android手册,重温移动开发 本文约3千字,新手阅读需要7分钟,复习需要2分钟 【 收藏随时查阅不再迷路 】 众所周知,人生是一个漫长的流程,不断 克服困难 ,不断反思前进的过程。在这个

    2023年04月09日
    浏览(32)
  • 微软Power Platform 零基础 Power Apps canvas+SharePoint 画布应用基础搭建应用流程学习实践进阶

    我们在上节学习了基础 Power Apps canvas+Power Automate 画布应用基础搭建应用流程. 那么本节我们继续学习实践进阶基础画布应用。 本节学习来源:探索BI、自动化、低代码的技术与融合— 微软Power Platform平台赋能全民开发者 《全民开发大讲堂》. 1、需求背景 公司内巡检小组将定

    2024年02月04日
    浏览(57)
  • Unity材质球个人学习笔记

    2023年04月08日
    浏览(35)
  • 无人机基础扫盲(个人学习版)

            飞行器的坐标系参考的是当地水平坐标系.即地理坐标系( 经纬度 ).与自身相互连接的叫做载体坐标系. 通常把X轴作为飞行器的前方. 针对于飞行器主要是三个角度方面的数值  : 翻滚角  Roll (记作ϕ)、俯仰角  Pitch (记作θ)和航向角  Yaw (记作ψ)         俯仰

    2024年02月19日
    浏览(38)
  • QT初始学习中的个人基础认知

    安装的时候 感觉更像 python的库安装和编译器版本的配合安装 。进入 创建工程 时,感觉是c++语言的创建工程的感觉,而且可以看到main和h的头文件, 整体来看是C++来编写的程序 。完成整个工程个人感觉是 C++编写功能,使用VB实现界面设计。 但第一眼见QT的UI界面,感觉这*

    2024年02月10日
    浏览(36)
  • 【UGUI】学会Unity中UGUI中UI元素自适应问题

    彻底学会Unity中UGUI中UI元素自适应问题 官方介绍:设计用于多种分辨率的 UI - Unity 手册 所所谓自适应就是画面元素跟随屏幕分辨率的改变而保持相对位置或者自身像素同步改变! 屏幕分辨率自适应:依靠画布缩放器组件完成 相对位置:依靠锚点位置完成,锚点主要负责保持

    2024年02月04日
    浏览(36)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包