Canvas的三种画布渲染模式

 第一个参数RenderMode的渲染模式有三种:Screen Space-Overlay、Screen Space-Camera以及World Space。

  1.Screen Space-Overlay模式

  Screen Space-Overlay(屏幕控件-覆盖模式)的画布会填满整个屏幕空间,并将画布下面的所有的UI元素置于屏幕的最上层,或者说画布的画面永远“覆盖”其他普通的3D画面,如果屏幕尺寸被改变,画布将自动改变尺寸来匹配屏幕,如下图效果:

                                                                     

                              (在此模式下,虽然在Canvas前放置了3D人物,但是在Game窗口中并不能观察到3D人物)

  Screen Space-Overlay模式的画布有Pixel Perfect和Sort Layer两个参数:

  (1)Pixel Perfect:只有RenderMode为Screen类型时才有的选项。使UI元素像素对应,效果就是边缘清晰不模糊。

  (2)Sort Layer: Sort Layer是UGUI专用的设置,用来指示画布的深度。

  2.Screen Space-Camera模式

  Screen Space-Camera(屏幕空间-摄影机模式)和Screen Space-Overlay模式类似,画布也是填满整个屏幕空间,如果屏幕尺寸改变,画布也会自动改变尺寸来匹配屏幕。所不同的是,在该模式下,画布会被放置到摄影机前方。在这种渲染模式下,画布看起来 绘制在一个与摄影机固定距离的平面上。所有的UI元素都由该摄影机渲染,因此摄影机的设置会影响到UI画面。在此模式下,UI元素是由perspective也就是视角设定的,视角广度由Filed of View设置。

  这种模式可以用来实现在UI上显示3D模型的需求,比如很多MMO游戏中的查看人物装备的界面,可能屏幕的左侧有一个运动的3D人物,左侧是一些UI元素。通过设置Screen Space-Camera模式就可以实现上述的需求,效果如下图所示:

                                                                                       

  它比Screen Space-Overlay模式的画布多了下面几个参数:

  (1)Render Camera:渲染摄像机

  (2)Plane Distance:画布距离摄像机的距离

  (3)Sorting Layer: Sorting Layer是UGUI专用的设置,用来指示画布的深度。可以通过点击该栏的选项,在下拉菜单中点击“Add Sorting Layer”按钮进入标签和层的设置界面,或者点击导航菜单->edit->Project Settings->Tags and Layers进入该页面。

    可以点击“+”添加Layer,或者点击“-”删除Layer。画布所使用的Sorting Layer越排在下面,显示的优先级也就越高。

  (4)Order in Layer:在相同的Sort Layer下的画布显示先后顺序。数字越高,显示的优先级也就越高。

  3.World Space

  World Space即世界控件模式。在此模式下,画布被视为与场景中其他普通游戏对象性质相同的类似于一张面片(Plane)的游戏物体。画布的尺寸可以通过RectTransform设置,所有的UI元素可能位于普通3D物体的前面或者后面显示。当UI为场景的一部分时,   可以使用这个模式。

  它有一个单独的参数Event Camera,用来指定接受事件的摄像机,可以通过画布上的GraphicRaycaster组件发射射线产生事件。

  这种模式可以用来实现跟随人物移动的血条或者名称,如下图所示:

                                                                           

  我们通过下面的表格可以对比一下三种渲染模式的区别:

渲染模式 画布对应屏幕 摄像机 像素对应 适合类型
Screen Space-Overlay 不需要 可选 2D UI
Screen Space-Camera 需要

可选

2D UI
World Space 需要 不可选

3D UI

 

 

 

 

 

 

我们先来说Screen Space-Camera,这个了解了,其他模式也就简单了。顾名思义,此模式我们需要一个Camera,这个相机的作用就是把它所投射获取到的界面当做UI界面。一般情况下,UI界面只是一个二维平面,所以把相机的投影设置为Orthographic,即正交投影,Culling Mask设置为UI,表示只显示跟UI层相关的信息,接着再调整一下相机的Size,让他的大小与Canvas的保持一致,最后再设置一下相机的Z值,保证Canvas在相机之前就搞定了,如下图:

红色的为canvas,它在相机的视域范围内,就可以正常显示了。

 

明白了这些,很多问题就迎刃而解了,比如模型显示在UI界面上的问题,很多人都推荐用RenderTexture,这样要用一个单独的相机,其实哪要这么麻烦啊,可以为模型新增一个Model层,然后UICamera的CullingMask增加Model Layer,这样模型就可以被UICamera获取了,这时候只要把模型的Z轴值设置的比Canvas更靠近UICamera,就可以显示在普通UI界面上方了。

Screen Space -OverLay可以理解为Unity为你自动设置好了UICamera,而且这个相机的Depth值是大于100的(相机能设置的最大Depth值为100),所以永远显示在最前面。此模式UICamera的Z值应该是-1000,所以Z值只要大于-1000并在UICamera的正交投影范围内,就有可能显示的UI界面上。

 

World Space就更简单了,就是把UI当做三维物体来处理。

posted @ 2018-09-16 20:18  EkkoMay  阅读(1697)  评论(0编辑  收藏  举报