aframe
Mixins
Suche…
Einführung
Mixins bieten eine Möglichkeit, häufig verwendete Sätze von Komponenteneigenschaften zusammenzustellen und wiederzuverwenden. Sie werden mit dem <a-mixin> -Element definiert und in <a-assets> . Mixins sollten mit einer ID festgelegt werden. Wenn eine Entität diese ID als Mixin-Attribut festlegt, übernimmt die Entität alle Attribute des Mixins.
Beispiel für die Verwendung von Mixins
<a-scene>
<a-assets>
<a-mixin id="red" material="color: red"></a-mixin>
<a-mixin id="blue" material="color: blue"></a-mixin>
<a-mixin id="cube" geometry="primitive: box"></a-mixin>
</a-assets>
<a-entity mixin="red cube"></a-entity>
<a-entity mixin="blue cube"></a-entity>
</a-scene>
Die Entität mit dem roten Würfel nimmt die Eigenschaften aus der roten Mischung und der Würfelmischung in dieser Reihenfolge auf. Ebenso mit dem blauen Würfel. Konzeptionell erweitern sich die obigen Elemente um:
<a-entity material="color: red" geometry="primitive: box"></a-entity>
<a-entity material="color: blue" geometry="primitive: box"></a-entity>
Komponenteneigenschaften zusammenführen
Eigenschaften einer Komponente mit mehreren Eigenschaften werden zusammengeführt, wenn sie von mehreren Mixins und / oder der Entität definiert werden. Zum Beispiel:
<a-scene>
<a-assets>
<a-mixin id="box" geometry="primitive: box"></a-mixin>
<a-mixin id="tall" geometry="height: 10"></a-mixin>
<a-mixin id="wide" geometry="width: 10"></a-mixin>
</a-assets>
<a-entity mixin="wide tall box" geometry="depth: 2"></a-entity>
</a-scene>
Alle Eigenschaften der Geometriekomponenten werden zusammengeführt, da sie als Mixins enthalten und in der Entität definiert sind. Die Entität wäre dann äquivalent zu:
<a-entity geometry="primitive: box; height: 10; depth: 2; width: 10"></a-entity>
Ordnung und Vorrang
Wenn eine Entität mehrere Mixins enthält, die dieselben Komponenteneigenschaften definieren, hat das Mixin ganz rechts Vorrang. Im folgenden Beispiel enthält die Entität sowohl red als auch blue Mixins. Da das blue Mixin zuletzt enthalten ist, ist die endgültige Farbe des Würfels blau.
<a-scene>
<a-assets>
<a-mixin id="red" material="color: red"></a-mixin>
<a-mixin id="blue" material="color: blue"></a-mixin>
<a-mixin id="cube" geometry="primitive: box"></a-mixin>
</a-assets>
<a-entity mixin="red blue cube"></a-entity>
</a-scene>
Wenn eine Entität selbst eine Eigenschaft definiert, die bereits durch ein Mixin definiert ist, hat die Definition der Entität Vorrang. Im folgenden Beispiel umfasst die Entität sowohl red als auch blue Mixins und definiert auch eine grüne Farbe. Da das Objekt direkt seine eigene Farbe definiert, ist die endgültige Farbe des Würfels grün.
<a-scene>
<a-assets>
<a-mixin id="red" material="color: red"></a-mixin>
<a-mixin id="blue" material="color: blue"></a-mixin>
<a-mixin id="cube" geometry="primitive: box"></a-mixin>
</a-assets>
<a-entity mixin="red blue cube" material="color: green"></a-entity>
</a-scene>