canvas scaler 画布定标器（UI Componet）

像素、分辨率与宽纵比
像素（色彩块）：是指在由一个数字序列表示的图像中的一个最小单位，称为像素。
分辨率：（resolusion）=>即像素个数

屏幕=>硬件
屏幕的分辨率（Screen Resolution）：运行时显示器设备的分辨率，它是指屏幕图像的精密度，当屏幕的分辨率越高，它可显示的像素就越多；使用横向分辨率X纵向分辨率表示 （800X600）
屏幕宽纵比：（Aspect Radios）:即屏幕的宽高比，一般是最简分数比表示（4：3）；
屏幕分辨率与屏幕宽纵比的关系：当屏幕的分辨率确定，屏幕的宽纵比也随之确定，屏幕的宽纵比一确定画布的宽纵比被确定下来；当屏幕的宽纵比确定时，屏幕的分辨率是不一定的；

屏幕分辨率的确定=>使用unity对屏幕分辨率与宽纵比的模拟：在Game窗口的Aspect按钮
（这里的屏幕是一个泛性概念，对移动端来说，一般游戏都是满屏显示，屏幕指的就是设备屏幕；但对于PC端而言，游戏可能是在一个局部窗口运行的，屏幕指的就是游戏运行的窗口）
    1）当使用屏幕分辨率来确定屏幕时，这个屏幕是被定死的；即使Game窗口发生变化，屏幕的分辨率和宽纵比都不会发生变化；
   
    2）当使用屏幕宽纵比来确定屏幕时，unity会依据当前窗口的尺寸，计算最佳的屏幕分辨率以将规定宽纵比的屏幕最大限度放置在Game窗口里；窗口发生变化时，屏幕的宽纵比不会变，而屏幕分辨率会变 ；
    
    3）当使用FreeAspect确定屏幕时，屏幕的分辨率即Scene窗口的分辨率
    


    无论使用哪种方式来模拟屏幕，每一时刻只能模拟一种分辨率的屏幕来观察画布的适应情况，不同的只是Scene窗口的尺寸改变是否会引起屏幕分辨率的改变而已，只要我们不动窗口，屏幕的分辨率就是确定的；
    Game窗口所确定的屏幕分辨率只是供开发者模拟调试用的，它不会变影响在特定环境下的运行结果，实际运行在设备上的发布产品仍然要看设备显示器或者运行窗口的实际分辨率；

画布（一张在运行时实时更新的照片（在非overlay模式下是摄像机拍到的））
画布的分辨率：（Canvas Resulution）:我们可以把画布看成合成图，画布的分辨率就是这张合成图片的分辨率；
画布的宽纵比：在GameSpace-Overlay和GameSpace-屏幕宽纵比；

画布分辨率在哪里可以看到：
    1）Canvas的RectTransform组件，width和Hight即屏幕的分辨率（1600X1200）
    2)选中Canvas，拖动Canvas的边，看到的数字即分辨率

            实际上，不只是Canvas，拖动任意的UI元素都可以看到它们的宽高，即这张UI元素的分辨率

画布分辨率如何确定
    1）画布的宽纵比确定：画布的宽纵比=屏幕的宽纵比
     2）画布的分辨率确定：屏幕的宽纵比+CanvasScale的属性；这才引入重点菜CanvasScaler（请认真看CanvasScaler）
            
    
canvas scaler 画布定标器（UI Componet）=>确定Canvas分辨率，并决定UI元素的缩放规则
巨型繁琐但仍然可以理解的
描述：决定画布上的ui元素如何缩放。
            官译：Canvas Scanler组件用来画布"整体的缩放比例"和"UI元素的像素密度"（pixel dencity）;这个缩放比例会影响画布里的所有东西，包括字体大小和图片的边界；
            理解:给画布定标的过程就是给画布确定分辨率和设置UI元素尺寸的过程；

UI scale mode:UI缩放模式
    1.Constant Pixel Size:恒定的像素尺寸（默认）
    描述：该模式下，无论屏幕大小如何变化，UI元素的像素大小保持（retain）不变；
    UI元素以像素为单位，它们的位置和尺寸在屏幕中都被确定下来，如果Canvas没有挂载Canvas Scaler组件，这就是默认的定标模式；
     理解:抛开锚点的限制，该模式下UI元素的像素大小会保持不变，所以当屏幕分辨率很大时，UI元素会被缩放的很小(实际并非缩小了UI元素，而是由于屏幕分辨率过大导致的)；当屏幕分辨率很低时，UI元素会被放的很大甚至占满屏幕或连屏幕都放不下.
             
    
    Scale Factor:比例系数，设置这个系数以确定一个像素的缩放比例，并应用到Canvas的所有UI元素上；
    画布的分辨率的宽度=屏幕分辨率的宽度/ScaleFactor;高度亦是如此

2.scale with screen side:根据屏幕尺寸大小进行缩放（UI面板常用）
    描述：该模式下，定标器会根据屏幕载体的分辨率来布局，屏幕越大，UI元素就越大，反之亦然
这是调整UI的常用模式，当屏幕出现拉伸时，UI元素会出现等比例的拉升，利用它能减少锚点的尿性
reference resolution:参考分辨率，即给UI布局所设计的标准分辨率；分辨率越大，UI元素随之放大，反正亦然，UI元素根据这个分辨率进行放缩；                               
screen match mode:屏幕匹配模式：如果当前屏幕分辨率的宽纵比和参考分辨率的宽纵比不适应时，选择一种模式来缩放画布的分辨率；
Screen Match Mode是针对画布分辨率缩放（先不要把它与UI元素缩放搭上关系）
什么是当前屏幕分辨率的宽纵比和参考分辨率不适应？
       例如，参考分辨率（reference resolution）是800X600,那么参考分辨率的宽纵比就是4：3，但是屏幕的宽纵比是5：4，需要重新计算画布的分辨率，使得画布适用屏幕的宽纵比。
        1)Match Width or Height:通过画布的参考分辨率的宽或高对画布进行定标
                
               当Match=0,画布的宽度即参考分辨率的宽度；（调整好之后会上下留白）
               当Match=1,画布的高度即参考分辨率的高度；（常用的，调整好之后横屏游戏会左右留白）
                具体的计算公式（总结）：设屏幕的宽纵比为W:H,参考分辨率为X×Y,Match的值为m，则画布的分辨率w×h为：
                        w=X*[(W-m*(W-H))/W]
                        h=(H/W)*w
        2)Expand,扩张的，实际就是Match Width or Height模式下m=0,w=X,=>适用于竖版游戏。上下留白。
                例如，屏幕分辨率为1440X2960,参考分辨率为720X1280,在Expand模式下的画布分辨率为720X1480.
        3)Shrink:收缩的，实际就是Match Width or Height模式下m=1,h=H=>适用于横板游戏，左右留白

Peference Pixels Per Unit：参考单元像素数量（？）

3.Constant Physical Size:恒定的物理尺寸(遗留)
       描述：无论屏幕的大小和分辨率如何变化，UI元素的物理尺寸保持不变 ；

遗留问题：
1.当画布分辨率很低，而屏幕分辨率很高时，为什么屏幕仍然可以显示高清图片？它们具体的运行机制是怎样的？
        画布的分辨率只是定义的画布和子UI的位置与大小的相对数值，用于调节各个UI之间的相对大小和位置关系，实际的显示分辨率以屏幕和图片自身的分辨率显示。
        所以无论将画布分辨率如何调低，对图片的实际显示没有影响，图片真实的显示分辨率应为图片自身分辨率与其在屏幕区域内的显示分辨率的较小值（即图片分辨率过大，而在屏幕的显示分辨率较小，以屏幕的显示分辨率为准）；
2.锚点与画布定标器是如何配合的，它们存在否优先级关系？
          首先应该是存在的，且锚点的优先级大于定标器的优先级的
3.锚点居中时，UI元素将完全不受锚点影响了，这是啥子道理？
         伪命题，UI元素只是大小不会变了，这是因为锚点的聚合导致无论父级物体如何缩放，UI元素每条对应边到锚点对应方向的距离的相对值都是不变的；但是UI元素的位置仍旧会变化。

画布在屏幕上的显示：
1）画布是ScreenSpace-Overlay和ScreenSpace-Camera的渲染模式：
        这两种模式下，画布的宽纵比=屏幕的宽纵比，所以画布总是会完全的显示在屏幕上
        当屏幕的分辨率>画布的分辨率时，即屏幕显示的精密度很高时，将非常紧密的展示整个画布；
                    
       当屏幕的分辨率<画布的分辨率时，即屏幕显示的精密度很低时，画布就会想打了马赛克一样，显示的很粗糙；
                   

2）画布是World-Space时，它的定标器模式默认为World

posted @ 2021-01-06 13:56  章校长  阅读(334)  评论(0)  编辑  收藏  举报