So verwenden Sie residente Knoten für die Ebenenverwaltung in CocosCreator

So verwenden Sie residente Knoten für die Ebenenverwaltung in CocosCreator

CocosCreator-Version: 2.3.4

Die meisten Spiele verfügen über Layer-Management, wie zum Beispiel

  • sceneLayer Szenen-Layer
  • PanelLayer-Popup-Ebene
  • tipLayer Tippbox-Ebene

Die Szenen in Cocos sind nicht persistent und werden bei jedem Wechsel automatisch zerstört. Wenn Sie diese Ebenen auf die Szene legen, müssen Sie sie dann für jede Szene einmal legen? Und dann bekomme ich es erneut, was sehr ärgerlich ist.

Die Szene wird mit cc.director.loadScene geladen. Der Containerknoten der Szene scheint ein nodeActivator im Director zu sein.

Lassen wir jetzt den Szenencontainer oder den Container der obersten Ebene von Cocos außer Acht. Mir fallen zwei Ansätze zum Layer-Management ein.

1. Es gibt nur eine Szene

Das ganze Spiel hat eine Szene, nämlich die Szene am Anfang des Spiels. In dieser Szene werden Knoten von Ebenen wie sceneLayer platziert. Diese Eingangsszene entspricht der Bühne von Egret und Laya.

Dann werden alle Szenen und Popup-Module in Prefabs umgewandelt und bei jeder Anzeige wird einfach ein Child zur entsprechenden Ebene der Einstiegsszene hinzugefügt.

2. Verwenden Sie residente Knoten

Beispielsweise habe ich Ebenen wie „sceneLayer“ in Szene 1 eingefügt. Zur einfacheren Anzeige habe ich jeder Ebene eine einzelne Farbe hinzugefügt.

Der residente Knoten muss sich unter dem Stammknoten befinden, also auf derselben Ebene wie die Zeichenfläche. Legen Sie die drei Ebenen als permanente Knoten fest.

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

Wechseln Sie dann die Szene. In der neuen Szene können Sie weiterhin Ebenen wie Szenenebene anzeigen und abrufen.

beim Laden(){
    console.log(cc.find("sceneLayer")); //CC.Node von sceneLayer ausgeben
}

Mithilfe von residenten Knoten können wir Ebenen wie Szenenebene in der Eingangsszene platzieren. Verwenden Sie die Layer-Management-Klasse, um die Referenz zu speichern.

Bewährte Vorgehensweisen

Layer-Management-Klasse, Singleton

exportiere Standardklasse LayerManager erweitert cc.Component {

    private statische Instanz: LayerManager;
    öffentliche statische ins():LayerManager{
        wenn (diese.Instanz == null) {
            diese.Instanz = neuer LayerManager();
        }
        gib diese Instanz zurück;
    }

    öffentliches PanelLayer:cc.Node;
    öffentliche tipLayer:cc.Node;
    
}

Legen Sie in der Einstiegsszene eine residente Knotenebene fest und verwenden Sie die Ebenenverwaltungsklasse, um die Referenz zu speichern. Zur späteren Verwendung.

@ccklasse
exportiere Standardklasse Helloworld erweitert cc.Component {

    beim Laden(){
        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");
    }
}

Oben finden Sie Einzelheiten zur Verwendung von Resident Nodes für die Layer-Verwaltung in CocosCreator. Weitere Informationen zu Resident Nodes für die Layer-Verwaltung in CocosCreator finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!

Das könnte Sie auch interessieren:
  • CocosCreator Erste Schritte Tutorial: Netzwerkkommunikation
  • So erstellen Sie WeChat-Spiele mit CocosCreator
  • Detaillierte Erklärung, wie CocosCreator-Systemereignisse generiert und ausgelöst werden
  • So verwenden Sie einen Gamecontroller in CocosCreator
  • Detaillierte Erklärung des digitalen Puzzles CocosCreator Huarongdao
  • Detaillierte Erklärung des Fischschwarm-Algorithmus im CocosCreator-Spiel
  • Detaillierte Erklärung der CocosCreator-Optimierung DrawCall
  • CocosCreator implementiert Skill-Kühleffekt
  • Detaillierte Erklärung des Cocoscreater-Prefabs
  • Detaillierte Erläuterung des CocosCreator-Nachrichtenverteilungsmechanismus

<<:  Detailliertes Verständnis von umask in den neuen Linux-Dateiberechtigungseinstellungen

>>:  So übertragen Sie Dateien zwischen Docker-Container und lokalem Computer

Artikel empfehlen

Einfaches Anwendungsbeispiel für eine rekursive Vue-Komponente

Vorwort Ich glaube, dass viele Studenten bereits ...

MySQL ruft die aktuelle Datums- und Uhrzeitfunktion ab

Holen Sie sich das aktuelle Datum + die aktuelle ...

Grafisches Tutorial zur Installation von MySQL 5.5.27

1. Installation von MySQL 1. Öffnen Sie die herun...

Grundlegende Konzepte und allgemeine Methoden des Map-Mappings in ECMAScript6

Inhaltsverzeichnis Was ist eine Zuordnung? Unters...

So implementieren Sie ein Dropdown-Menü für die HTML-Eingabe

Code kopieren Der Code lautet wie folgt: <html...

25 Beispiele für Website-Design im Nachrichtenstil

bmi Voyager Heugabel Ulster Lebensmittelhändler F...

Webdesign-Tutorial (6): Behalte deine Leidenschaft für Design

<br />Vorheriger Artikel: Webdesign-Tutorial...

Der Unterschied zwischen HTML-Block-Level-Tags und Inline-Tags

1. Blockebenenelement: bezieht sich auf die Fähigk...

nginx+tomcat-Beispiel für den Zugriff auf das Projekt über den Domänennamen

Ich wollte wissen, wie ich mit einem Domänennamen...

Grafisches Tutorial zur Installation von CentOS7 auf VMware 15.5

1. Erstellen Sie eine neue virtuelle Maschine in ...

Analyse des Unterschieds zwischen absolutem und relativem Pfad in HTML

Wie in der Abbildung gezeigt: Mit einer einzelnen ...