Canvas Scaler 的3种模式

(金庆的专栏 2021.3)

参考:
https://wenku.baidu.com/view/83991090336c1eb91b375db8.html

Unity Canvas 有个 Canvas Scaler 组件,用来决定 Canvas 的 Scale(缩放)值。
Scale 有 X,Y,Z 3个分量,都是同一值,即在各个方向上都是同倍率缩放的。
它有3种Scale Mode。

因为设计时的宽高比与目标机型宽高比不同,Canvas 需要先增减为目标高宽比,然后再缩放。
Canvas 缩放并不影响UI元素的相互位置,只是同比缩放。
但是高宽比调整时会造成UI元素的相对位置变化,如宽度增大后,UI元素会在宽度方向上相互散开。

可以在 Unity Editor Game 页左上角分辨率下拉菜单中创建几个低分辨率屏,用来测试屏幕大小切换。
测试界面可放置2个按钮,一个锚定到左上,位于左上,一个锚定到右下,位于右下,不要strech。

3种模式如下。

Constance Pixel Size

Constance Pixel Size 模式下,Scale 总是为1。
目标机上的 Canvas 就是其分辨率大小。
因为设计时分辨率与实际分辨率不同,显示会不同。
但是图片和按钮的大小保持固定像素大小。
如果屏幕变大,UI元素就会相互散开,变小则聚拢。
如果需要缩放,只能通过程序调节。

Scale With Screen Size

随屏幕大小缩放。
该模式下有个 Reference Resolution (参考分辨率),应该设为主流机型的分辨率。
在主流机型下,Scale 为1,与设计显示相同。

https://blog.csdn.net/u011948420/article/details/112641308
2020中国移动游戏质量白皮书-WeTest 报告 Android 手机 TOP300 分辨率为 2340*1080 占 31%。

如果目标机型为 46802160,则 Scale 正好为2;如果目标机型为 1179540,则Scale为0.5.

一般情况下宽高比不同,此时Scale算法有3种,即3种Sceen Match Mode:

Match Width Or Height

匹配宽度或高度。

此时有个 Match 划动条,可以在 Width(0)…Height(1)之间。
如果为0,匹配宽度,则 Scale 为目标屏宽与参考屏宽之比;
如果为1,匹配高度,则 Scale 为目标屏高与参考屏高之比;
如果为0.5, 加权匹配,则是这2个比值的平均值。

匹配宽度时,高度方向上会有UI扩散或聚拢。
匹配高度时,宽度方向上会有UI扩散或聚拢。
加权匹配时,UI在高上扩散宽上聚拢,或者在高上聚拢宽上扩散。

Expand

增加。先增加宽或高到目标宽高比。该增加方向UI元素会散开。

Shrink

减少。先减少宽或高到目标宽高比。该减少方向UI元素会聚拢。

Constant Physical Size

固定物理大小。
随着4k屏的出现,屏幕DPI会很大,许多设备的像素点非常小。
同样的按钮,在高DPI下,如果固定像素大小,则会非常小,这时适合用该模式。

Canvas Scaler 的3种模式相关推荐

  1. unity2D学习(14)血条显示、Canvas中Render Mode的三种模式介绍

    1 血条素材处理 分割处理:对上一章画出来的血条图片做分割处理 整理素材格式: Sprite Mode选择Multiple:因为一张图片包含多个素材. Pixels Per Unit单位像素为16:与 ...

  2. UGUI中的Canvas、Camera和Canvas Scaler

    原文:http://www.jianshu.com/p/96fd1fbe8409 投影空间和屏幕空间 先不说UI,如果是一个普通渲染流程,一个Cube普通地被渲染. 800X600的屏幕中,右边的Cu ...

  3. oracle 几种锁,oracle_基于oracle中锁的深入理解,ORACLE里锁有以下几种模式:0:no - phpStudy...

    基于oracle中锁的深入理解 ORACLE里锁有以下几种模式:0:none 1:null 空 2:Row-S 行共享(RS):共享表锁 3:Row-X 行专用(RX):用于行的修改 4:Share ...

  4. Unity快速入门之一 3D基础概念、Camera、Canvas RenderMode的几种方式对比

    最近要给公司的小伙伴做Unity入门,针对几个常用的知识进行快速入门介绍. Unity快速入门之一 3D基础概念.Camera.Canvas RenderMode的几种方式对比_翕翕堂 Unity快速 ...

  5. 2021年大数据Spark(九):Spark On Yarn两种模式总结

    目录 Spark On Yarn两种模式 引入 一.当一个MR应用提交运行到Hadoop YARN上时 二.当一个Spark应用提交运行在集群上时 注意 client 模式 cluster 模式 总结 ...

  6. spi协议时序图和四种模式实际应用详解

    大家好,我是无际. 上个章节我们讲解了spi接口定义,今天我们更加深入讲解下spi协议时序图和spi四种模式的用法. 刚开始接触单片机开发时,最怕就是看时序图,对于我来说就是奇怪的知识. 特别是SPI ...

  7. Oracle 11g dataguard三种模式以及实时查询(Real-time query)功能设置

    之前我们讨论过<Linux Oracle 11g dataguard物理standby 配置过程>, 但是在实际过程中会遇到不同的问题,首先我们讨论下ORACLE DATAGUARD的三种 ...

  8. 一文把Redis主从复制、哨兵、Cluster三种模式摸透

    概述 Redis作为缓存的高效中间件,在我们日常的开发中被频繁的使用,今天就来说一说Redis的四种模式,分别是「单机版.主从复制.哨兵.以及集群模式」. 可能,在一般公司的程序员使用单机版基本都能解 ...

  9. 简述python中怎样导入模块_Python中导入模块的两种模式,import

    import import pandas import pandas as pd 使用函数方式:.(),或者.() 比如 pandas.read_csv("data/stock.csv&qu ...

  10. SAP EWM 与 AGV 机器人对接的三种模式

    SAP EWM 与 AGV 机器人对接的三种模式 https://mp.weixin.qq.com/s/xGfUMSBTEMYKce5oXcWDqA 导读    本文转载自:弘毅供应链,跟随供应链专家 ...

最新文章

  1. 【数论基础】欧几里德算法及其各种应用
  2. SpringMVC调用接口一直乱码
  3. java将字符串和字符串数组互相转换方法
  4. [做题记录]AtCoder AGC做题记录
  5. 统计自然语言处理基础(一)
  6. BZOJ 2243 染色(树链剖分好题)
  7. 项目计划与控制-若干题目
  8. 【转】如何理解NPV与IRR的区别??
  9. 区块链实战超级账本视频教程|区块链视频教程
  10. iMac上用bootcamp安装Win10遇到的问题总结
  11. 使用qq邮箱作为程序客户端自动发送邮件
  12. Latex 图像、表格标题(题注)加脚注
  13. 西安奥创软件研究院在博客园的博客开通
  14. uni-app 尺寸单位设置换算关系
  15. ddr走线教程_DDR3 Fly By走线精讲
  16. ui界面设计基本原则
  17. 360做专业手机电商平台还是有搞头
  18. 【设计模式从青铜到王者】第二篇:UML类图与面向对象编程
  19. win7打不开计算机网络连接,win7电脑网络连接正常打不开网页怎么解决
  20. 如何通过重写hashCode()方法将偏向锁性能提高4倍?

热门文章

  1. 系统与软件过程改进09年年会,CMMI vs 敏捷PK赛参赛感言
  2. android dummy codec
  3. ISSN码和ISBN码的区别
  4. NOD32杀毒软件升级ID
  5. 华为0基础——名字的美丽度
  6. 如何摆脱CRUD等打杂状态,从事更高价值工作
  7. WordPress-Autumn响应式自媒体主题
  8. 网络工程师笔记--广域网和接入网
  9. 【雅思大作文考官范文】——第十四篇:festivals essay
  10. 如何规避采购风险?五种有效的采购风险防范措施