Aフレームの3つのフレームでリングを通って歩く緑色のリングを描くにはどうすればいいですか？

Question

私はAFRAMEの新人です。カーソルが誰かのエンティティに移動したときに、リング（またはカーソル）が緑色で少しずつ着色されることが予想されます。このアクションは、ヒューズをトリガする時間を通知します。 AFRAMEはそうすることができますか？

Answer 1

はい。ここでは、スケールを持つ例です。

https://aframe.io/docs/0.3.0/components/cursor.html#adding-visual-feedback

<a-entity cursor="fuse: true; fuseTimeout: 500" 
      position="0 0 -1" 
      geometry="primitive: ring" 
      material="color: black; shader: flat"> 
    <a-animation begin="click" easing="ease-in" attribute="scale" 
       fill="backwards" from="0.1 0.1 0.1" to="1 1 1"></a-animation> 
    <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale" 
       fill="forwards" from="1 1 1" to="0.1 0.1 0.1"></a-animation> 
</a-entity> 

円を行うには、あなたはそれが融合すると、それが円を描く作るためにはむしろ規模よりも、円のthetaLengthをアニメーションすることができます。

<a-entity cursor="fuse: true; fuseTimeout: 500" 
      position="0 0 -1" 
      geometry="primitive: ring" 
      material="color: black; shader: flat"> 
    <a-animation begin="click" easing="ease-in" attribute="scale" 
       fill="backwards" from="0.1 0.1 0.1" to="1 1 1"></a-animation> 
    <a-animation begin="cursor-fusing" easing="ease-in" attribute="geometry.thetaLength" 
       fill="forwards" from="0" to="360"></a-animation> 
</a-entity>