aframe
System
Suche…
Einführung
Ein System des Entity-Component-System-Patterns bietet globalen Klassen, Services und Management für Klassen von Komponenten. Es bietet öffentliche APIs (Methoden und Eigenschaften) für Komponentenklassen. Auf ein System kann über das Szenenelement zugegriffen werden und Komponenten können mit der globalen Szene verbunden werden.
Das Kamerasystem verwaltet beispielsweise alle Objekte mit der Kamerakomponente und steuert, welche Kamera die aktive Kamera ist.
Parameter
| Parameter | Einzelheiten |
|---|---|
| Daten | Durch das Schema bereitgestellte Daten für Handler und Methoden |
| el | Verweis auf <a-scene> |
| Schema | Verhält sich wie Komponentenschemas. Parses zu Daten. |
Bemerkungen
Methoden
Ein System definiert wie eine Komponente Lifecycle-Handler. Es kann auch Methoden definieren, die als öffentliche API gedacht sind.
| Methode | Beschreibung |
|---|---|
| drin | Wird einmal aufgerufen, wenn das System initialisiert wird. Wird zum Initialisieren verwendet. |
| Pause | Wird aufgerufen, wenn die Szene angehalten wird. Wird verwendet, um dynamisches Verhalten zu stoppen. |
| abspielen | Wird aufgerufen, wenn die Szene startet oder fortgesetzt wird. Wird verwendet, um dynamisches Verhalten zu starten. |
| Tick | Wenn definiert, wird bei jedem Tick der Render-Schleife der Szene aufgerufen. |
Ein System registrieren
Ein System wird ähnlich wie eine A-Frame-Komponente registriert.
Wenn der Systemname mit einem Komponentennamen übereinstimmt, hat die Komponente als this.system eine Referenz auf das System
AFRAME.registerSystem('my-component', {
schema: {}, // System schema. Parses into `this.data`.
init: function () {
// Called on scene initialization.
},
// Other handlers and methods.
});
AFRAME.registerComponent('my-component', {
init: function () {
console.log(this.system);
}
});
Zugriff auf ein System
Ein instanziiertes System kann über die Szene aufgerufen werden:
document.querySelector('a-scene').systems[systemName];
Auf registrierte Systemprototypen kann über AFRAME.systems zugegriffen werden.
Trennung von Logik und Daten
Systeme können helfen, Logik und Verhalten von Daten zu trennen, wenn dies gewünscht wird. Wir lassen Systeme das schwere Heben übernehmen, und die Komponenten kümmern sich nur um die Verwaltung ihrer Daten über ihre Lebenszyklusmethoden:
AFRAME.registerSystem('my-component', {
createComplexObject: function (data) {
// Do calculations and stuff with data.
return new ComplexObject(data);
}
});
AFRAME.registerComponent('my-component', {
init: function () {
this.myObject = null;
},
update: function () {
// Do stuff with `this.data`.
this.myObject = this.system.createComplexObject(this.data);
}
});
Alle Komponenten eines Systems zusammenstellen
Es gibt keine strikte API, um zu definieren, wie Systeme Komponenten verwalten. Ein übliches Muster ist, dass Komponenten sich selbst beim System anmelden. Das System hat dann Verweise auf alle seine Komponenten:
AFRAME.registerSystem('my-component', {
init: function () {
this.entities = [];
},
registerMe: function (el) {
this.entities.push(el);
},
unregisterMe: function (el) {
var index = this.entities.indexOf(el);
this.entities.splice(index, 1);
}
});
AFRAME.registerComponent('my-component', {
init: function () {
this.system.registerMe(this.el);
},
remove: function () {
this.system.unregisterMe(this.el);
}
});