UGUI多个Canvas的渲染先后层次关系设置

最新推荐文章于 2024-07-15 00:18:03 发布
最新推荐文章于 2024-07-15 00:18:03 发布
阅读量4.3k 收藏 5
点赞数 3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43667944/article/details/86610694
版权
在Unity3D中，当存在多个Canvas时，调整UI控件的渲染顺序成为一个挑战。本文介绍了尝试使用API以及研究渲染顺序的过程，包括Camera的Depth、SortingLayer和Z轴的影响。最终发现通过修改Canvas的Sort Order属性可以实现不同Canvas间UI的渲染层次控制，确保特定窗口始终显示在最上方。
摘要由CSDN通过智能技术生成
               

这几天在做游戏的WindowManager，一开始只是想到打开单一窗口和设置窗口并存的问题，一切运行良好。

但是昨天加了一个等待窗口(沙漏加菊花)之后就出现了问题。


首先说明我的Window的结构：

一个空的GameObject

Canvas

所有的UI控件


举例说：

在登录界面，点击登录按钮后向服务器发送登录请求，这个时候会显示转菊花的界面，一切OK。



窗口打开顺序为 登录窗口  --- 等待窗口

下面的大图就是登录窗口，上面的就是沙漏菊花等待窗口。


这个时候如果再弹出一个其它的界面，比如弹出了一个滚动公告，那按照先后顺序来说，滚动公告就会显示在等待界面之上，这是不行的。


我的目的呢，就是要让等待界面显示在最上面！


首先，从MOMO的博文中了解到，貌似有一个API可以使用，

SetSiblingIndex

就是设置 物体在视图中的顺序。


但是实际使用后得出结论，这个

最低0.47元/天 解锁文章
这个有点吓人
关注
html5 多个 canvas 重叠,在canvas元素中创建多个可拖拽的矩形html5
weixin_39811166的博客
05-31 862
使用drawOldShapes()方法，您可以保留旧的矩形。var canvas = document.getElementById('canvas'),ctx = canvas.getContext('2d'),// ctx.globalAlpha = 0.5;rect = {},drag = false;var rectStartXArray = new Array() ;var rectSt...
Canvas的渲染先后顺序
qq_40967331的博客
09-03 1380
Canvas 一、Overlay模式下 SortOder越大越后渲染,如果两个Canvas的SortOder一样，谁先创建的谁后渲染，和在Hierarchy的前后顺序无关 二、一个canvas是overlay模式一个canvas是camera模式,overlay的画面始终覆盖camera的画面 3、都是camera模式下canvas的sorting layer一样 order in layer一样 ...
UGUI优化篇（更新中）
最新发布
2301_76618920的博客
07-15 1387
UGUI优化
Unity-Canvas层级
LeePorter的博客
11-29 3508
我在一个panel上添加了Canvas组件 通过代码 canvas.overrideSorting = true;         canvas.sortingOrder = 99; 来调整该panel的层次 但是panel下的button不会被触发，请问这种情况如何解决呀   答：通过Panel挂Canvas组件，动态调整Panel层级，挂graphic raycaster组件是为了让UI事...
KING_Unity学习之UGUI_Canvas渲染顺序以及层次关系总结
KingSea_168的专栏
12-10 9747
之前一直用NGUI开发界面，但看到现在的unity的新版本的UGUI也不错，这几天专门学习了一下，用过NGUI的人都知道NGUI的渲染顺序或者层级关系是Deapth(深度)决定，而UGUI的界面是用Canvas(画布)进行布局的，它的渲染顺序有所不同，下面我进行了总结： Unity UGUI 1.Unity3d中的渲染顺序如下：   不同的Camera的Depth   相同Camera下的
复合canvas叠加显示
weixin_30687051的博客
04-26 350
<!-- Licensed under a BSD license. See license.html for license --> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content...
html5 多个 canvas 重叠,html5 - canvas元素 - 多个图层
weixin_36049183的博客
05-31 1103
与此相关：如果你的画布上有东西，并且你想在它的背面画一些东西 - 你可以通过将context.globalCompositeOperation设置改为'destination-over'来实现它 - 然后当你''时将它返回'source-over'重做。var co = document.getElementById('cvs').getContext('2d');// Draw a red sq...
UGUI-- Canvas对象及Canvas组件
Go_Accepted的博客
04-17 1114
1、Canvas渲染模式控制组件： 画布，是UGUI中所有UI元素能够被显示的根本，主要负责渲染自己的所有UI子对象 注意：如果UI控件对象不是Canvas的子对象，那么控件将不能被渲染，可以通过修改Canvas组件上的参数修改渲染方式 2、场景中可以有多个Canvas对象： 可以分别管理不同画布的渲染方式，分辨率适应方式等参数（不常用） 注意：如果没有特殊需求，一般场景上一个Canvas即可 第二个Canvas对象需要通过UGUI单独创建，即右键新建Canvas对象 3、Canva.
UGUI-- Canvas Scaler 分辨率自适应组件
Go_Accepted的博客
04-17 1561
1、CanvasScaler是什么 用于分辨率自适应的画布缩放控制器，主要负责在不同分辨率下UI控件大小自适应，并不负责位置，位置由之后的RectTransform组件负责，提供了3种分辨率自适应的模式 2、基本概念： （1）屏幕分辨率：Game窗口种的Stats统计数据窗口看到的当前“屏幕”分辨率（Screen）会参与分辨率自适应的计算 （2）画布大小和缩放系数：选中Canvas对象后在RectTransform组件种看到的宽高和缩放（Width，Height，Scale） 宽高 * 缩..
Unity 3D UGUI 游戏界面 Canvas组件
songhuanfei2017的博客
10-21 1837
Canvas组件是UI的基础画布，所有UI元素都必须放在Canvas组件下面，并且它支持嵌套。 Canvas支持3种绘制方式，Overlay（最上层） Camera 和 World Space（3D布局），其中用的最多的是Camera，它可以把正交摄像机投影出来的UI元素绘制在Canvas面板上。 //--自适应屏幕 自适应屏幕需要画布，Canvas的同级需要绑定Canvas Sc...
UGUI——Canvas
IncompleteEncy的博客
08-07 230
覆盖模式也是Canvas的默认模式，这一模式的Canvas下的所有UI会永远处于屏幕的最前方，不会被游戏场景当中的物体遮挡。值得注意的是该模式下的Canvas可以遮挡另外两种模式的Canvas，反之则不行。在这一模式下的Canvas可以视作空间中的物体，只不过会与渲染该Canvas摄像机相对固定，该模式的Canvas需要绑定一个摄像机用于显示Canvas下的UI内容，同时Canvas和绑定的摄像机可拍摄到的物体产生遮挡关系。
在canvas画布上多次绘制图形叠加的效果
mxydl2009的博客
02-14 5413
如果在画布2d上下文连续绘制多次相同的图形，比如 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;画布简单实践&lt;/title&gt; &lt;/head&gt; &lt;body&g
javascript学习-canvas图的叠加
qq_43368682的博客
08-04 5431
canvas图的叠加 【重要】源图像 = 您打算放置到画布上的绘图。 目标图像 = 您已经放置在画布上的绘图。 图像操作 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <canvas id="canvas" width="800" height="600"&g
2个canvas叠加运用(时钟例子)
weixin_30628801的博客
02-27 1146
最近在学习canvas,http://corehtml5canvas.com/code-live/，主要的学习方式就是通过上面的一些例子来学习canvas的一些用法。但是我发现，这里的例子，只要canvas的内容有一点点变化（甚至是某个元素位置的变动），都会去清空整个canvas然后整个canvas重绘。例如下面时钟的例子 http://corehtml5canvas.com/code-liv...
html两个画布位置重叠,两个canvas
weixin_42501130的博客
05-30 2957
html5 两个canvas重叠放在一个div里面，每个canvas将图片素材引入网页，定义canvas标签，获取canvas的上下文。定义一个画图片的函数，使用canavs绘图API里面的drawImage来完成。html如何在一个页面放多个canvas一个canvas可以画两个Canvast2D如何不用html5 canvas 实现两个方框的连线效果在同一个canvas里画了两个图后，怎样把一...
使用HTML5画布（Canvas）模拟图层（Layers）效果
cnds123的专栏
02-28 1983
使用HTML5画布（Canvas）模拟图层（Layers）效果
在Unity的UGUI系统里使用Renderer的显示层级研究 (二) Canvas组件之间的显示规则
fjjaylz的博客
03-16 2171
文章目录1. Canvas的三种模式2. ScreenSpace-Overlay模式下的显示 之前做了一下三维物体的显示层级测试，这一章做一下Canvas之间的相互显示 1. Canvas的三种模式 canvas的显示有三种显示模式，也就是WorldSpace、ScreenSpace-Overlay、ScreenSpace-Camera： ScreenSpace-Overlay 这种模式是Can...
Canvas操作以及图层
qiaoyanfei的专栏
09-07 8139
应用程序绘制图形以及控制图形的动画都是在其上面实现的，它提供了图形绘制的真实表面和绘制图形相关的接口，你的绘画操作真正通过它被渲染在窗口的Bitmap上，使得用户可见。
Unity中UGUI使用过多的Canvas会有什么性能问题吗？
05-16
是的，使用过多的Canvas可能会导致性能问题，因为Canvas是需要进行渲染的。每个Canvas都需要在屏幕上绘制自己的内容，并且在层次结构中，Canvas越深，渲染的成本也就越高。 因此，如果您使用太多的Canvas，则可能会导致帧速率下降。为了避免这种情况，您可以尝试将多个UI元素组合到一个Canvas中，或者使用Canvas的渲染顺序来减少Canvas的数量。另外，还可以使用UI对象池来避免重复创建UI元素，从而减少Canvas的数量和渲染成本。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值