aframe에 등록 할 프리미티브의 일부인 프리미티브의 구성 요소에 값을 설정하는 방법은 무엇입니까?

Question

다른 프리미티브로 구성된 프레임에 프리미티브를 등록하려고합니다. 하지만 이러한 내부 기본 요소를 개별적으로 확장 및 배치하려고합니다. 그러나 위치 자체가 하나의 구성 요소이기 때문에 이러한 내부 기본 요소는 위치가 없으므로 주변을 이동할 수 없습니다.

등록하고자하는 프리미티브의 일부인 프리미티브의 구성 요소에 대한 값을 어떻게 설정할 수 있습니까?

AFRAME.registerPrimitive('a-svrbutton', { 
 
    defaultComponents: { 
 
    geometry: { 
 
     primitive: 'box', 
 
     height: 1.5, 
 
     depth: 0.2, 
 
     width: 3.5 
 
    }, 
 
    material: { 
 
     opacity: 1.0, 
 
     transparent: true, 
 
     side: 'Double', 
 
     color: '#8450ff' 
 
    }, 
 
    position: { 
 
     x: 0, 
 
     y: 0, 
 
     z: -5 
 
    }, 
 
    'bmfont-text': { 
 
     text: 'hola', 
 
     color: '#ffffff' 
 
    }, 
 

 
    }, 
 
    mappings: { 
 
    height: 'geometry.height', 
 
    width: 'geometry.width', 
 
    depth: 'geometry.depth', 
 
    color: 'material.color', 
 
    opacity: 'material.opacity', 
 
    position: 'position' 
 
    } 
 
});

<script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script> 
 

 
<a-scene> 
 
    <a-svrbutton id="mybutton" position="0 0 -5"></a-svrbutton> 
 
</a-scene>

^{브라우저가 위의 코드 실행하려면 WebVR를 지원하는지 확인하십시오.}

기본 "구성 요소"bmfont-text의 기본 위치를 임의의 x 및 z로 정의하려고합니다. 하지만이 '원시적 인'요소에는 위치 요소 자체가 없기 때문에 그럴 수 없습니다. 어떻게해야합니까? 그래서 당신은 당신의 질문에 샘플 코드를 추가 할 수 있다면 - 당신이 무슨 일을하는지

Answer 1

primitive는 일반적으로 하나 개 이상의 구성 요소이 아닌 다른 프리미티브를위한 속기, 그래서 오해 할 수있다?

당신은 일반적으로 원시가 이미 해당 구성 요소가없는 경우에도, 원시적 잘 관련이없는 구성 요소를 추가 할 수 있습니다

<a-text text="Hello World;" position="0 0 -5"></a-text> 

이 작동하지 않는 경우에, 나는 구성 요소로 bmfont 사용하는 것이 좋습니다 것을 오히려 <a-text /> 프리미티브 버전보다 구성 요소 및 유지 mixin보다 안정적 될 수 있도록

<a-entity bmfont-text="text: Hello World;" position="0 0 -5"></a-entity> 

은 A-프레임 v0.3.0로, 일부 bugs with primitives있다.

Answer 2

하나의 방법은 두 개의 별도 엔티티로 만드는 것입니다.

<a-entity> 
    <a-srvbutton></a-srvbutton> 
    <a-text></a-text> 
</a-entity> 

아니면 bmfont 텍스트를 래핑하는 래퍼 구성 요소를 만드시겠습니까?

AFRAME.registerComponent('bmfont-text-wrapper', { 
    schema: { 
    textPosition: {type: 'vec3'}, 
    text: {type: 'string'} 
    }, 

    init: function() { 
    var text = document.createElement('a-entity'); 
    text.setAttribute('bmfont-text', this.data.text); 
    text.setAttribute('position', this.data.textPosition); 
    this.el.appendChild(text); 
    } 
}); 

그런 다음 매핑을 추가하십시오.