aframe
Podmioty

Ramka A reprezentuje byt za pośrednictwem elementu <a-entity> . Zgodnie z definicją we wzorcu encja-komponent-system, encje są obiektami zastępczymi, do których podłączamy komponenty, aby zapewnić im wygląd, zachowanie i funkcjonalność.

METODY

addState (stateName)

addState wypchnie stan na encję. Spowoduje to wyemitowanie zdarzenia stateadded i możemy sprawdzić stan istnienia za pomocą .is :

entity.addEventListener('stateadded', function (evt) {
  if (evt.detail.state === 'selected') {
    console.log('Entity now selected!');
  }
});
entity.addState('selected');
entity.is('selected');  // >> true

emitować (nazwa, szczegół, bąbelki)

emit emituje niestandardowe zdarzenie DOM na encji. Na przykład możemy wyemitować zdarzenie wyzwalające animację:

<a-entity>
  <a-animation attribute="rotation" begin="rotate" to="0 360 0"></a-animation>
</a-entity>

entity.emit('rotate');

Możemy również przekazać szczegóły zdarzenia lub dane jako drugi argument:

entity.emit('collide', { target: collidingEntity });

Domyślnie wydarzenie zostanie zawieszone. możemy powiedzieć, że nie ma bańki, podając false za bańkę:

entity.emit('sink', null, false);

flushToDOM (rekurencyjny)

flushToDOM ręcznie serializuje dane komponentów jednostki i aktualizuje DOM.

getAttribute (componentName)

getAttribute pobiera przeanalizowane dane komponentu (w tym mixiny i wartości domyślne).

// <a-entity geometry="primitive: box; width: 3">
entity.getAttribute('geometry');
// >> {primitive: "box", depth: 2, height: 2, translate: "0 0 0", width: 3, ...}
entity.getAttribute('geometry').primitive;
// >> "box"
entity.getAttribute('geometry').height;
// >> 2
entity.getAttribute('position');
// >> {x: 0, y: 0, z: 0}

Jeśli nazwa_składnika nie jest nazwą zarejestrowanego składnika, getAttribute będzie zachowywać się tak, jak zwykle:

// <a-entity data-position="0 1 1">
entity.getAttribute('data-position');
// >> "0 1 1"

getDOMAttribute (componentName)

getDOMAttribute pobiera tylko przeanalizowane dane komponentów, które są jawnie zdefiniowane w DOM lub za pośrednictwem setAttribute . Jeśli componentName to nazwa zarejestrowanego składnika getDOMAttribute powróci tylko dane składowe określone w HTML jako sparsowaną obiektu. getDOMAttribute dla komponentów jest częściową formą getAttribute, ponieważ zwrócone dane komponentów nie zawierają zastosowanych mixin ani wartości domyślnych:

Porównaj dane wyjściowe powyższego przykładu getAttribute :

// <a-entity geometry="primitive: box; width: 3">
entity.getDOMAttribute('geometry');
// >> { primitive: "box", width: 3 }
entity.getDOMAttribute('geometry').primitive;
// >> "box"
entity.getDOMAttribute('geometry').height;
// >> undefined
entity.getDOMAttribute('position');
// >> undefined

getObject3D (typ)

getObject3D wyszukuje potomka THREE.Object3D, do którego odwołuje się typ na object3DMap .

AFRAME.registerComponent('example-mesh', {
  init: function () {
     var el = this.el;
     el.getOrCreateObject3D('mesh', THREE.Mesh);
     el.getObject3D('mesh');  // Returns THREE.Mesh that was just created.
  }
});

getOrCreateObject3D (typ, konstruktor)

Jeśli encja nie ma THREE.Object3D zarejestrowanego typu , getOrCreateObject3D zarejestruje utworzoną instancję THREE.Object3D za pomocą przekazanego konstruktora . Jeżeli jednostka nie posiada zarejestrowanej pod THREE.Object3D typu getOrCreateObject3D będzie działać jako getObject3D:

AFRAME.registerComponent('example-geometry', {
  update: function () {
    var mesh = this.el.getOrCreateObject3D('mesh', THREE.Mesh);
    mesh.geometry = new THREE.Geometry();
  }
});

pauza ()

pause () zatrzyma wszelkie zachowania dynamiczne zdefiniowane przez animacje i komponenty. Kiedy wstrzymamy byt, zatrzyma on swoje animacje i wywoła Component.pause () na każdym z jego składników. Komponenty decydują się zaimplementować to, co dzieje się podczas pauzy, która często usuwa detektory zdarzeń. Encja wywoła pause () na swoich encji potomnych, gdy wstrzymamy encję.

// <a-entity id="spinning-jumping-ball">
entity.pause();

Na przykład komponent look-control podczas pauzy usunie procedury obsługi zdarzeń, które nasłuchują danych wejściowych.

grać ()

play () uruchomi dowolne zachowanie dynamiczne zdefiniowane przez animacje i komponenty. Jest to wywoływane automatycznie, gdy DOM dołącza jednostkę. Kiedy encja gra () , encja wywołuje play () na encji potomnej.

entity.pause();
entity.play();

Na przykład komponent dźwiękowy podczas odtwarzania rozpocznie odtwarzanie dźwięku.

setAttribute (componentName, wartość, [propertyValue | clobber])

Jeśli nazwa_składnika nie jest nazwą zarejestrowanego składnika lub składnik jest składnikiem pojedynczej właściwości, setAttribute zachowuje się tak, jak zwykle:

entity.setAttribute('visible', false);

Chociaż nazwa_składnika jest nazwą zarejestrowanego składnika, może on obsługiwać specjalne analizowanie wartości. Na przykład komponent pozycji jest komponentem pojedynczej właściwości, ale parser typu właściwości pozwala mu na przyjęcie obiektu:

entity.setAttribute('position', { x: 1, y: 2, z: 3 });

setObject3D (typ, obj)

setObject3D zarejestruje przekazany obj, THREE.Object3D, jako typ pod object3DMap jednostki. Ramka A dodaje obiekt obj jako element podrzędny obiektu głównego obiektu3D .

AFRAME.registerComponent('example-orthogonal-camera', {
  update: function () {
    this.el.setObject3D('camera', new THREE.OrthogonalCamera());
  }
});

removeAttribute (componentName, propertyName)

Jeśli nazwa_składnika jest nazwą zarejestrowanego składnika, wraz z usunięciem atrybutu z DOM, removeAttribute również odłączy składnik od obiektu, wywołując metodę usuwania cyklu życia składnika.

entity.removeAttribute('goemetry');  // Detach the geometry component.
entity.removeAttribute('sound');  // Detach the sound component.

Jeśli podano właściwośćNazwa , removeAttribute zresetuje wartość właściwości określonej przez właściwość propertyName do wartości domyślnej właściwości:

entity.setAttribute('material', 'color', 'blue');  // The color is blue.
entity.removeAttribute('material', 'color');  // Reset the color to the default value, white.

removeObject3D (typ)

removeObject3D usuwa obiekt określony przez typ z THREE.Group bytu, a tym samym ze sceny. Spowoduje to zaktualizowanie obiektu3DMap obiektu , ustawiając wartość klucza typu na null . Jest to zwykle wywoływane z komponentu, często w module obsługi usuwania:

AFRAME.registerComponent('example-light', {
  update: function () {
    this.el.setObject3D('light', new THREE.Light());
    // Light is now part of the scene.
    // object3DMap.light is now a THREE.Light() object.
  },
  remove: function () {
    this.el.removeObject3D('light');
    // Light is now removed from the scene.
    // object3DMap.light is now null.
  }
});

removeState (stateName)

removeState wyświetli stan z encji. Spowoduje to wyemitowanie usuniętego zdarzenia i możemy sprawdzić stan jego usunięcia za pomocą .is :

entity.addEventListener('stateremoved', function (evt) {
  if (evt.detail.state === 'selected') {
    console.log('Entity no longer selected.');
  }
});
entity.addState('selected');
entity.is('selected');  // >> true
entity.removeState('selected');
entity.is('selected');  // >> false

WYDARZENIA

SZCZEGÓŁY WYDARZENIA

Poniżej znajduje się szczegół wydarzenia dla każdego wydarzenia: