aframe
Mixiny
Szukaj…
Wprowadzenie
Mixiny zapewniają sposób komponowania i ponownego wykorzystywania powszechnie używanych zestawów właściwości składników. Są one definiowane za pomocą elementu <a-mixin>
i są umieszczane w <a-assets>
. Mixiny powinny być ustawione za pomocą identyfikatora, a gdy jednostka ustawia ten identyfikator jako swój atrybut mixin, jednostka pochłonie wszystkie atrybuty mixinu.
Przykładowe użycie mixin
<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>
Jednostka z czerwoną kostką pobierze właściwości z czerwonej mieszanki i mieszanki kostki w tej kolejności. Podobnie jest z niebieskim sześcianem. Pod względem koncepcyjnym powyższe byty rozwijają się do:
<a-entity material="color: red" geometry="primitive: box"></a-entity>
<a-entity material="color: blue" geometry="primitive: box"></a-entity>
Scalanie właściwości komponentu
Właściwości komponentu zawierającego wiele właściwości zostaną scalone, jeśli zostaną zdefiniowane przez wiele miksów i / lub jednostki. Na przykład:
<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>
Wszystkie właściwości komponentu geometrii zostaną scalone, ponieważ są uwzględnione jako mixiny i zdefiniowane w elemencie. Jednostka byłaby wówczas równoważna:
<a-entity geometry="primitive: box; height: 10; depth: 2; width: 10"></a-entity>
Porządek i pierwszeństwo
Gdy jednostka zawiera wiele miksów, które definiują te same właściwości komponentu, pierwszeństwo ma miks po prawej stronie. W poniższym przykładzie jednostka zawiera zarówno red
jak i blue
mieszankę, a ponieważ blue
mieszanka jest uwzględniona jako ostatnia, końcowy kolor kostki będzie niebieski.
<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>
Jeśli sama jednostka definiuje właściwość, która jest już zdefiniowana przez mixin, jej definicja ma pierwszeństwo. W poniższym przykładzie jednostka zawiera zarówno red
jak i blue
mixiny, a także określa kolor zielony. Ponieważ jednostka bezpośrednio określa swój kolor, końcowy kolor kostki będzie zielony.
<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>