【Unity】 Canvas及UI屏幕自适应的基本介绍

已于 2023-06-19 09:20:47 修改
阅读量2.6k 收藏 4
点赞数
分类专栏： unity基础 文章标签： unity 游戏引擎
于 2023-05-23 10:40:43 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_35079107/article/details/130820400
版权
本文主要介绍了Unity中的Canvas组件及其在游戏UI中的作用。Canvas是UGUI系统的基础，包含RectTransform、Canvas、CanvasScaler和GraphicRaycaster等关键组件，用于控制UI元素的位置、渲染、缩放和交互。Canvas的渲染模式包括Screen Space Overlay、Screen Space Camera和World Space，适配不同场景需求。Canvas Scaler用于实现不同分辨率的屏幕自适应，提供了Constant Pixel Size、Scale With Screen Size和Constant Physical Size三种缩放模式。最后，文章还提到了Canvas的基本创建和比例自适应的设置方法。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

Canvas的基本介绍

一、基本介绍

1. 什么是Canvas？

当使用Unity引擎开发游戏时，可以使用Canvas（画布）来处理游戏中的用户界面（UI）。

Canvas画布是UGUI系统最基础的容器类控件，所有的UI控件必须位于Canvas画布控件之内，即必须是Canvas容器的子控件。Canvas的主要功能是提供一个容器来放置和管理UI元素。可以通过设置Canvas的属性来控制UI元素的位置、层级、渲染方式以及与用户输入的交互。Canvas可以通过挂载在场景中的游戏对象上或在代码中动态创建。

属性 描述
渲染模式 用于指定Canvas的渲染模式，包括屏幕空间覆盖（Screen Space Overlay）、屏幕空间相机（Screen Space Camera）和世界空间（World Space）。
轴心点 决定Canvas的位置和旋转中心。可以是矩形的四个角落、中心或自定义位置。
排序层级 控制Canvas渲染的顺序。具有较高排序层级的Canvas将在具有较低层级的Canvas之上渲染。
分辨率 指定
了解本专栏 订阅专栏 解锁全文 超级会员免费看
【UGUI】学会Unity中UGUI中UI元素自适应问题
leoysq的博客
09-19 3443
就像画一幅画，首先我们需要一张什么也没有的白纸贴在画板上（这个画板就是：Canvas）,有了画板以后，我们就可以一层层的铺上画面元素了，这些画面元素就是具体的UI元素（包括：一个图、按钮、滚动条、勾选框、文本框等等）而且，在层级面板的UI名称列表中（大纲列表）排在上面的就会被放在图层下方，后面创建的UI会遮住早先创建的，就像一层层的画画一样，后面刷的颜色肯定是在最前方。但是UI元素的锚点定位好了,我UI元素本身呢，这还不好说吗，就像任何图像在设计软件在都会围绕锚点，并且跟随锚点。UI元素本身也会跟随锚点。
unity打包时UI的自适应
Jason的博客
06-04 3479
unity打包时UI的自适应 本文摘自 https://blog.youkuaiyun.com/qq_15020543/article/details/82595179 感谢博主分享的干货，以此记录一下。同时感谢文中的另两位博主 http://www.cocoachina.com/game/20160602/16570.html 和 https://blog.youkuaiyun.com/st75033562/artic...
Unity 屏幕自适应的三种方法（UI控件/Canvas/摄像机视口）总结
点点滴滴，记录成长！~~~~~~
10-06 1万+
经常会用到Unity 自适应的问题，今天来总结以下三点。 1.UI控件自适应 UI控件（Button,Image等）的自适应是用的最多的，通常通过锚点的设定，来完成UI控件的适应。根据UI控件需要锁定的不同位置，设置锚点的位置。 2.Canvas自适应 不同的设备，分辨率不同，这时候Canvas需要根据不同的分辨率缩放，需要设置Canvas组件上的Canvas Scale脚本 的UI Scale...
在Unity中实现UI屏幕自适应
-木水水-
10-26 3104
如果适配高度，则应承受UI放大所造成的影响如果适配宽度，则应使用更大高度的背景图片，避免上下黑边的产生如果适配高度，则应使用宽度更大的背景图片，避免上下黑边的产生如果适配宽度，则应承受UI放大所造成的影响无论是PC端、移动端还是其他，除了开启屏幕分辨率缩放和正确设置锚点外，还要根据项目的具体情况，选择最优的适配方式6*2%3D12。
UNITY 屏幕UI自适应
最新发布
qq_20527905的博客
04-15 434
1.主要就是根据屏幕的选择根据尺寸 和UI的锚点和中心点来选择，也可以通过代码来动态修改。
Unity实现Ui自适应屏幕
qq_62893047的博客
06-01 1599
实现Ui自适应屏幕：无论屏幕如何缩放，对应的UI总是始终保持在相对屏幕的位置。
Unity UI自适应
Leyen的博客
07-11 508
Unity UI自适应
Unity 实现UI自适应
slf_tragon的博客
05-29 807
5.下面的Match是已上门为基础 （建议 如果是横屏已高为主 竖屏相反 方形建议在中间看个人需求）但是在这样设置完后会发现很多的UI的子集部分或者很多UI还是原本大小这样就需要用代码来自适应。在做UI功能的时候都要注意对屏幕的自适应 应为不同的手机设备都拥有不同的分辨率。2.Canvas自带的Canvas Scaler组件。先看看Unity 自带的自适应功能。所以自适应的分辨率是必不可少的。4.是宽和高已上门分辨率为基础。3.选择具体如图所示。也可以封装方法来使用。
Unity3d UI自适应CanvasScaler测试工程
06-10
总的来说，Unity3d UI自适应CanvasScaler是一个复杂但至关重要的主题，掌握其使用技巧对于创建高质量、多平台兼容的UI至关重要。通过TestCanvasScaler项目，我们可以实践并深入理解CanvasScaler的各种设置，提升开发...
Unity UGUI 自适应
weixin_44439733的博客
12-01 1499
UGUI自适应
Unity 屏幕自适应
海月的博客
07-21 2603
在UI层级创建一个图像作为背景 Canvas的Render Mode设置为 Screen Space - Overlay Canvas Scaler的UI Scale Mode设置为 Scale With Screen 选定Canvas - Background ，使用 Rect Tool 调整大小，使之占满画布 好的，就是这些 ...
unity3d中UI自适应
oyang_mrong的博客
09-12 1631
unity3d中针对UI界面的自适应问题，其内嵌了自己的算法，如何使用它的算法呢？ 很简单！！！ 找到Canvas的属性界面中的Canvas Scaler 其中将UI Scale Mode设置为：Scale With Screen Size，将Reference Resolution中x，y设置为主流分辨率（如1920*1080）（Reference Resolution的作用为：当buil...
Unity之屏幕自适应
青衫磊落长歌行的博客
09-12 2571
今天，小黑给大家带来一个还算不错的知识，屏幕自适应，如果喜欢就点赞转发并且关注哟~
[UnityUI]UGUI自适应
热门推荐
宏哥的博客
03-12 2万+
参考链接： http://www.jianshu.com/p/96fd1fbe8409 http://blog.sina.com.cn/s/blog_4148e8630102vji9.html http://www.xuanyusong.com/archives/3278 关键点： 0.自适应的测试：通过设置多种的屏幕大小进行测试，测试时最好要打开Maximize o
unity canvas 屏幕自适应
tianyongheng的专栏
06-01 1万+
untiy 屏幕自适应，一般根据固定宽或高进行适配 1.UI屏幕自适配 UI Scale Mode 设置为Scale With Screen Size; 注意 Math 设置需要根据实际需要 分情况而定 比如横屏：屏幕高度确定是1080，宽不确定，可能是双排，这是屏幕适配 with=0，界面设置 比如竖屏 屏幕宽度确定比如800，高度不确定，这时屏幕适配hight=1, 2.R...
【Unity】UI自适应-可变形
HG2131的博客
01-16 2180
文章目录前言一、功能代码1.锚点重置2.场景备份3.场景还原4.UI自适应二、代码总览三、知识点1.anchorMin 与 anchorMax2.offsetMin 与 offsetMax3.localPosition4.sizeDelta5.rect6.GetWorldCorners()四、知识点说明文章链接 前言 本文内容为UI控件，水平、垂直方向均变化的自适应处理。即UI与屏幕大小同比例变形。 同时包含：锚点重置、场景备份与还原功能 一、功能代码 1.锚点重置 代码如下： private vo.
Unity中设置UI组件屏幕自适应
qq_59273509的博客
08-17 1087
为了适应不同分辨率的场景，要保证UI组件做到在不同分辨率设备上的正常、美观的显示，设置组件参数为屏幕自适应。同时可以将Screen Math Model设置为按照宽和高进行匹配模式。在Canvas的Inspector中选择UI Scale Model。这样可以做到屏幕自适应效果！Match比例设置为0.5。
unityUI屏幕自适应
01-09
### Unity UI 屏幕适配方案 为了使 Unity 的 UI 能够自适应不同的屏幕分辨率，通常采用 Canvas Scaler 组件中的 `Scale With Screen Size` 模式。这可以通过调整 Canvas Scaler 的属性来实现，具体来说就是将 UI Scale Mode 设置为 Scale With Screen Size 并配置 Reference Resolution[^1]。 #### 配置 Canvas Scaler 当设置 Canvas Scaler 的 UI Scale Mode 为 Scale With Screen Size 后，还需要指定一个参考分辨率 (Reference Resolution)，该参数决定了 UI 元素在设计时的比例大小。对于不同尺寸的屏幕，Unity 将基于这个设定自动缩放 UI 来保持布局的一致性[^3]。 ```csharp // 获取 CanvasScaler 组件并修改其属性 using UnityEngine; using UnityEngine.UI; public class UIScalerSetup : MonoBehaviour { void Start() { CanvasScaler scaler = GetComponent<CanvasScaler>(); scaler.uiScaleMode = CanvasScaler.ScaleMode.ScaleWithScreenSize; scaler.referenceResolution = new Vector2(1920, 1080); // 设定参考分辨率为1920x1080 } } ``` 除了内置的方法外，在 Asset Store 中也存在一些第三方工具能够简化这一过程，比如 TextMesh Pro 和 Resolution Manager 插件提供了额外的功能用于优化文本显示效果以及管理多种分辨率的支持[^2]。 #### 使用 Anchors 和 Pivot 进一步优化布局 Anchors（锚点）和 Pivots（中心点）是两个重要的概念，它们允许开发者创建更加灵活且响应式的界面。合理利用这两个特性可以使 UI 对象根据父级容器的变化而相应地调整位置和大小，从而更好地支持各种设备上的显示需求。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

灵境引路人

感谢投喂 ~ ❤

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值