Unity Canvas、Canvas Scaler、Graphic Raycaster、EventSystem 组件详解

2023-12-07 11:45

本文主要是介绍Unity Canvas、Canvas Scaler、Graphic Raycaster、EventSystem 组件详解,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

文章目录

  • 0. 参考文章
  • 1. Canvas
    • 1.1 Screen Space-Overlay —— 屏幕空间覆盖模式
    • 1.2 Screen Space-Camera —— 相机模式
    • 1.3 World Space —— 世界模式
  • 2. Canvas Scaler:控制UI画布的放大缩放的比例
    • 2.1 Constant Pixer Size —— 恒定像素
    • 2.2 Scale With Screen Size —— 根据屏幕缩放
      • 2.2.1 Match Width or Height —— 匹配宽度或高度
      • 2.2.2 Expand —— 扩张
      • 2.2.3 Shrink —— 收缩
      • 2.2.4 三种模式效果对比
    • 2.3 Constant Physical Size —— 恒定尺寸
  • 3. Graphic Raycaster:控制是否让UI响应射线点击
  • 4. EventSystem

0. 参考文章

https://blog.csdn.net/qq_33789001/article/details/117781577
https://blog.csdn.net/q764424567/article/details/119923544

1. Canvas

1.1 Screen Space-Overlay —— 屏幕空间覆盖模式

在这里插入图片描述

属性功能
Pixel Perfect使UI元素像素对应,效果就是边缘清晰不模糊
Sort Order多个Canvas时,数值越大越后渲染。值大的 画布,会挡住值小的
Target Display目标显示器,如果有多个屏幕的话可以选择
Addtional Shader Channels附加着色通道,决定Shader可以读取哪些相关数据,比如 法线、 切线 等数据。

1.2 Screen Space-Camera —— 相机模式

在这里插入图片描述

属性功能
Render Camera渲染的相机
Plane DistanceCanvas与相机之间的距离
Sorting Layer画布的深度,指定了相机的渲染顺序
Order In Layer值越大,该UI越显示在前面

1.3 World Space —— 世界模式

在这里插入图片描述

属性功能
Event Camera响应事件的相机
Sorting Layer画布的深度,指定了相机的渲染顺序
Order in Layer值越大,该UI越显示在前面

2. Canvas Scaler:控制UI画布的放大缩放的比例

参考文章:https://blog.csdn.net/qq_33789001/article/details/117781577

2.1 Constant Pixer Size —— 恒定像素

无论屏幕大小如何,UI 元素都保持相同的像素大小。
在这里插入图片描述

属性功能
Scale Factor缩放因子
Reference Pixels Per Uit单位面积像素数量

1920*1080 效果:
在这里插入图片描述
3000:100 效果:
在这里插入图片描述
可以看到无任何拉伸或者缩放,都是按设定的大小显示。

2.2 Scale With Screen Size —— 根据屏幕缩放

屏幕越大,UI 元素越大
在这里插入图片描述

属性功能
Referencee Resolution预设屏幕大小
Screen Match Mode缩放模式
Match宽高比

2.2.1 Match Width or Height —— 匹配宽度或高度

以宽度为参考、以高度为参考或介于两者之间的值来缩放画布区域

2.2.2 Expand —— 扩张

水平或垂直扩展画布区域,因此画布的大小永远不会小于参考

2.2.3 Shrink —— 收缩

水平或垂直裁剪画布区域,因此画布的大小永远不会大于参考

2.2.4 三种模式效果对比

1920 x 1080 分辨率下:
在这里插入图片描述
1.扩张
3000:100 效果:
在这里插入图片描述
这里可以看到,canvas的宽度进行了拓展(1920 --> 3240),高度保持不变(1080)同时整体收缩了0.9259倍,UI基本正常。
2.收缩
3000:100 效果:
在这里插入图片描述
这里可以看到,canvas的高度进行了收缩(1080 --> 640),宽度保持不变(1920)同时整体放大了1.5625倍。画面出现异常,左右两边居中的的绿色和橙色部分超出画面
3.匹配高度
3000:100 效果:
在这里插入图片描述
查看效果其实和扩张的效果是一致的
4.匹配宽度
在这里插入图片描述
查看效果其实和收缩的效果是一致的
5.匹配宽度高度
3000:1000 效果:
在这里插入图片描述
可以看到,canvas的宽度进行了收缩(1080 -->831),高度进行放大(1920 --> 2494)同时整体放大了1.2倍。画面出现异常,左右两边居中的的绿色和橙色部分已经遮挡其它元素。

2.3 Constant Physical Size —— 恒定尺寸

UI 元素无论屏幕大小和分辨率如何都保持相同的物理大小。
在这里插入图片描述

属性功能
Physical Unit使用单位
Fallback Screen DPI备用屏幕的DPI
Default Sprite DPI默认图片的DPI
Reference Pixels Per Uit单位面积像素数量

1920*1080 效果:
在这里插入图片描述
3000:100 效果:
在这里插入图片描述

3. Graphic Raycaster:控制是否让UI响应射线点击

在这里插入图片描述

属性功能
Ignore Reversed Graphic忽略反转的UI,UI反转后点击无效
Blocking Objects阻挡点击物体,当UI前有物体时,点击前面的物体射线会被阻挡
Blocking Mask阻挡层级,当UI前有设置的层级时,点击前面的物体射线会被阻挡

4. EventSystem

Canvas一同创建的还有一个EventSystem,这是一个基于Input的事件系统,可以对键盘、触摸、鼠标、自定义输入进行处理
在这里插入图片描述
Event System(Script)

属性功能
First Selected首选对象
Send Navigation Events发送导航事件
Drag Threshold拖动阈值

Event System负责处理输入、射线投射以及发送事件。
一个场景中只能有一个Event System组件。


Standalone Input Module(Script)

属性功能
Horizontal Axis横轴
Vertical Axis纵轴
Submit Button提交按钮
Canvel Button取消按钮
Input ActionsPer Second
Repeat Delay重复延迟
Force Module Active力模块激活

这篇关于Unity Canvas、Canvas Scaler、Graphic Raycaster、EventSystem 组件详解的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/465751

相关文章

SpringBoot3.4配置校验新特性的用法详解

《SpringBoot3.4配置校验新特性的用法详解》SpringBoot3.4对配置校验支持进行了全面升级,这篇文章为大家详细介绍了一下它们的具体使用,文中的示例代码讲解详细,感兴趣的小伙伴可以参考... 目录基本用法示例定义配置类配置 application.yml注入使用嵌套对象与集合元素深度校验开发

Python中的Walrus运算符分析示例详解

《Python中的Walrus运算符分析示例详解》Python中的Walrus运算符(:=)是Python3.8引入的一个新特性,允许在表达式中同时赋值和返回值,它的核心作用是减少重复计算,提升代码简... 目录1. 在循环中避免重复计算2. 在条件判断中同时赋值变量3. 在列表推导式或字典推导式中简化逻辑

Java Stream流使用案例深入详解

《JavaStream流使用案例深入详解》:本文主要介绍JavaStream流使用案例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录前言1. Lambda1.1 语法1.2 没参数只有一条语句或者多条语句1.3 一个参数只有一条语句或者多

SpringBoot整合mybatisPlus实现批量插入并获取ID详解

《SpringBoot整合mybatisPlus实现批量插入并获取ID详解》这篇文章主要为大家详细介绍了SpringBoot如何整合mybatisPlus实现批量插入并获取ID,文中的示例代码讲解详细... 目录【1】saveBATch(一万条数据总耗时:2478ms)【2】集合方式foreach(一万条数

Python装饰器之类装饰器详解

《Python装饰器之类装饰器详解》本文将详细介绍Python中类装饰器的概念、使用方法以及应用场景,并通过一个综合详细的例子展示如何使用类装饰器,希望对大家有所帮助,如有错误或未考虑完全的地方,望不... 目录1. 引言2. 装饰器的基本概念2.1. 函数装饰器复习2.2 类装饰器的定义和使用3. 类装饰

MySQL 中的 JSON 查询案例详解

《MySQL中的JSON查询案例详解》:本文主要介绍MySQL的JSON查询的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录mysql 的 jsON 路径格式基本结构路径组件详解特殊语法元素实际示例简单路径复杂路径简写操作符注意MySQL 的 J

Python ZIP文件操作技巧详解

《PythonZIP文件操作技巧详解》在数据处理和系统开发中,ZIP文件操作是开发者必须掌握的核心技能,Python标准库提供的zipfile模块以简洁的API和跨平台特性,成为处理ZIP文件的首选... 目录一、ZIP文件操作基础三板斧1.1 创建压缩包1.2 解压操作1.3 文件遍历与信息获取二、进阶技

一文详解Java异常处理你都了解哪些知识

《一文详解Java异常处理你都了解哪些知识》:本文主要介绍Java异常处理的相关资料,包括异常的分类、捕获和处理异常的语法、常见的异常类型以及自定义异常的实现,文中通过代码介绍的非常详细,需要的朋... 目录前言一、什么是异常二、异常的分类2.1 受检异常2.2 非受检异常三、异常处理的语法3.1 try-

Java中的@SneakyThrows注解用法详解

《Java中的@SneakyThrows注解用法详解》:本文主要介绍Java中的@SneakyThrows注解用法的相关资料,Lombok的@SneakyThrows注解简化了Java方法中的异常... 目录前言一、@SneakyThrows 简介1.1 什么是 Lombok?二、@SneakyThrows

Java中字符串转时间与时间转字符串的操作详解

《Java中字符串转时间与时间转字符串的操作详解》Java的java.time包提供了强大的日期和时间处理功能,通过DateTimeFormatter可以轻松地在日期时间对象和字符串之间进行转换,下面... 目录一、字符串转时间(一)使用预定义格式(二)自定义格式二、时间转字符串(一)使用预定义格式(二)自