Prefab-Instanziierung in 1.2.0

Die Prefab-Instanziierung ist der Prozess der Erstellung von Objekten und Komponenten aus einer .bin/.glb Datei.

Da die neue Instanziierungsmethode auf dem Konzept von Multiszene basiert, empfehlen wir, zuerst einen kurzen Blick auf unseren Multiszene-Blogbeitrag zu werfen.

Vor-1.2.0 

Die Instanzierung eines “Prefab” war über die (nun veraltete) append Methode verfügbar:

1const promises = [];
2for (let i = 0; i < 100; ++i) {
3    promises.push(await engine.scene.append('Zombie.bin'));
4}
5await Promise.all(promises);

Diese API hat Einschränkungen:

• Die Szene muss 100 Mal heruntergeladen und geparst werden
• Jedes Zombie.bin erstellt neue Meshes, Texturen und Materialien

Schauen wir uns an, wie die Wonderland Engine 1.2.0 hilft, diese Probleme zu lösen!

Instanziierung 

Jede Szene, die über loadScene geladen wird, kann Empfänger einer Instanziierung sein:

1const mainScene = await engine.loadMainScene('Scene.bin');
2const zombie = await engine.loadPrefab('Zombie.bin');
3
4// Erstelle eine Horde von Zombies
5for (let i = 0; i < 100; ++i) {
6    const {root} = mainScene.instantiate(zombie);
7}

Da das Ergebnis eine Object3D Instanz ist, kannst Du die Hierarchie wie folgt ändern:

1const {root} = mainScene.instantiate(zombie);
2// `root` ist das Object3D-Elternelement des gesamten `Zombie.bin` Szenengraphen
3root.setScalingLocal([0.5, 0.5, 0.5]);

Du kannst instantiate() sowohl auf aktiven als auch auf inaktiven Szenen aufrufen. Während das obige Beispiel zeigt, wie es auf einer aktiven Szene verwendet wird, funktioniert die Instanzierung in einer inaktiven Szene auf die gleiche Weise:

1const zombie = await engine.loadPrefab('Zombie.bin');
2const zombieHead = zombie.findByName('Head')[0];
3zombieHead.addComponent(LookAtComponent);
4
5const nextScene = engine.load('NextScene.bin');
6
7// Erst nach der Instanziierung werden LookAtComponent.onActivate()
8// und LookAtComponent.start() aufgerufen.
9nextScene.instantiate(zombie);

GLTF 

Die Instanziierung ist nicht auf das Wonderland Engine-Szeneformat (.bin) beschränkt, sondern kann auch mit glTF verwendet werden:

1const avocado = await engine.loadGLTF('Avocado.glb');
2
3// Mach einen Avocadosalat
4for (let i = 0; i < 100; ++i) {
5    const {root} = scene.instantiate(avocado);
6}

GlTF-Prefabs haben auch zusätzliche Methoden zur Verwaltung von Erweiterungen. Für weitere Informationen, schau bitte die PrefabGLTF API an.

Hinweis zu Ressourcen 

Wie im Multiszene-Blogbeitrag erwähnt, werden Ressourcen beim Laden in die engine Instanz verschoben. Dies ermöglicht es, dass mehrere Szenen auf dieselben Ressourcen verweisen, ohne den Speicher zu duplizieren.

Über Instanziierung erstellte Komponenten:

• Verweisen auf dieselben Ressourcen
• Das Löschen einer Ressource führt dazu, dass die Instanz auf einen null-Eintrag verweist

Weiterführende Links 

Hier sind einige Links, die Dir helfen, die Instanziierung in Deinen Projekten zu verwenden:

• Prefab Instanziierung GitHub Beispiel
• Scene.instantiate JavaScript API

Wir können es kaum erwarten zu sehen, wie die Community die Instanziierung nutzt, um großartige Erfahrungen zu schaffen!