如何在CocosCreator中利用常驻节点做图层管理

更新时间：2021年04月15日 09:06:19 作者：「已注销」

这篇文章主要介绍了如何在CocosCreator中利用常驻节点做图层管理，这些技巧非常实用，希望同学们看完，回去可以试一下

CocosCreator版本：2.3.4

一般游戏都有图层管理，比如

sceneLayer 场景层
panelLayer 弹框层
tipLayer 提示框层

cocos里的场景不是持久化的，每次切换都会自动destroy，如果在场景上放这些图层，那么每个scene都要放一遍？然后再获取，这样很麻烦。

加载场景使用的是cc.director.loadScene，scene的容器node貌似是director上的一个nodeActivator

现在如果不考虑scene的容器或者cocos的顶层容器。我想一想两种图层管理的方法。

一、只有一个scene

整个游戏一个scene，就是游戏入口的scene，在这个scene上放sceneLayer等图层的node，这个入口scene相当于egret和laya的stage。

然后所有场景scene和弹框模块，都做成预制件prefab，每次显示都addChild到入口scene的相应图层上就行了。

二、使用常驻节点

比如我在场景1，放置sceneLayer等图层。为了方便显示，我每个图层加了个单色。

常驻节点必须在根节点下，也就是和canvas同级。把3个图层设置为常驻节点。

onLoad(){
    cc.game.addPersistRootNode(cc.find("sceneLayer"));
    cc.game.addPersistRootNode(cc.find("panelLayer"));
    cc.game.addPersistRootNode(cc.find("tipLayer"));
}

然后切换场景，在新场景中，仍然可以显示并获取到sceneLayer等图层。

onLoad(){
    console.log(cc.find("sceneLayer"));  //输出sceneLayer的cc.Node
}

利用常驻节点，我们可以在入口场景中放置sceneLayer等图层。用图层管理类保存引用。

三、最佳实践

图层管理类，单例

export default class LayerManager extends cc.Component {

    private static instance:LayerManager;
    public static ins():LayerManager{
        if(this.instance == null){
            this.instance = new LayerManager();
        }
        return this.instance;
    }

    public panelLayer:cc.Node;
    public tipLayer:cc.Node;
    
}

在入口场景中设置常驻节点layer，用图层管理类保存引用。以备之后使用。

@ccclass
export default class Helloworld extends cc.Component {

    onLoad(){
        cc.game.addPersistRootNode(cc.find("sceneLayer"));
        cc.game.addPersistRootNode(cc.find("panelLayer"));
        cc.game.addPersistRootNode(cc.find("tipLayer"));

        LayerManager.ins().panelLayer = cc.find("panelLayer");
        LayerManager.ins().tipLayer = cc.find("tipLayer");
    }
}

以上就是如何在CocosCreator中利用常驻节点做图层管理的详细内容，更多关于CocosCreator常驻节点做图层管理的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:

JavaScript中的 attribute 和 jQuery中的 attr 方法浅析
这篇文章主要介绍了JavaScript中的 attribute 和 jQuery中的 attr 方法浅析,需要的朋友可以参考下
2017-01-01
JavaScript函数重载操作实例浅析
这篇文章主要介绍了JavaScript函数重载操作,结合一次面试经历分析了JavaScript函数重载相关原理、用法及操作注意事项,需要的朋友可以参考下
2020-05-05
javascript制作的简单注册模块表单验证
通常在我们的HTML页面表单中有大量的数据验证工作，免不了要写很多验证表单的js代码，这是一项非常繁琐枯燥的工作。很多程序员也会经常遗漏这项工作。所以写了这一段JavaScript代码提供给大家使用。使用起来很简单，大家拿回去自由扩展吧
2015-04-04
使用原生javascript开发计算器实例代码
这篇文章主要给大家介绍了关于如何使用原生javascript开发计算器的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2021-02-02
javascript 二维数组的实现与应用
javascript没有二维数组.所有自定义了一个数组类，下面是实例代码，需要的朋友可以参考下。
2010-03-03
layui+jquery支持IE8的表格分页方法
今天小编就为大家分享一篇layui+jquery支持IE8的表格分页方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-09-09
微信小程序中button去除默认的边框实例代码
这篇文章主要介绍了微信小程序中button去除默认的边框的实例代码，代码简单易懂，非常不错，具有一定的参考借鉴价值 ,需要的朋友可以参考下
2019-08-08
Openlayers实现地图的基本操作
这篇文章主要为大家详细介绍了Openlayers实现地图的基本操作，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-09-09
微信开发相关功能之使用微信JS-SDK接口
这篇文章主要给大家介绍了关于微信开发相关功能之使用微信JS-SDK接口的相关资料,微信SDK是一套开发工具包,为开发者提供了许多API接口,使得开发一个微信公众号变得更加简单,需要的朋友可以参考下
2023-12-12
js正则表达式注册页面表单验证
这篇文章主要为大家详细介绍了js正则表达式注册页面表单验证，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2016-10-10