0

我是 Aframes 的新手,我试图弄清楚如何在单击时将球体带到右手(Vive 控制器)的位置(想想绝地武力拉动类型动画)。

这是我到目前为止所拥有的,我不确定要为“右手位置”填写什么

<a-scene >
  <a-entity id="leftHand" hand-controls="left"></a-entity>
  <a-entity id="rightHand" hand-controls="right"></a-entity>
  <a-entity laser-controls="hand: right"></a-entity>

  <a-sphere class="sphere" id="mySphere" position="1 1 1" radius=".2" color="#2AFF00"
            bring-sphere-to-hand="">
            <a-animation attribute="position" from="1 1 1" to=<position-of-right-hand> dur=2000 begin=spherePull></a-animation>
</a-scene>

然后在我的javascript里面我有......

AFRAME.registerComponent('bring-sphere-to-hand', {
  schema: {},

  init: function () {
    var el = this.el;

    el.addEventListener('click', function () {
      el.emit('spherePull');
    });
  }
});

显然,这段代码不起作用,因为“右手位置”不是一回事。谁能给我一些关于如何使这项工作的指示?我的猜测是,点击它后,我需要添加一个克隆球体作为右手的孩子,然后将其拉到稍微修改的(0,0,0)。我在正确的轨道上吗?如果是这样,我能得到一些关于如何去做的指示吗?

4

1 回答 1

1

对于简单的直线动画,您可以使用https://github.com/ngokevin/kframe/tree/master/components/animation

el.setAttribute('animation', {
  property: 'position',
  from: fromEl.object3D.position,  // Forgot if you need to serialize this to string.
  to: toEl.object3D.position,
  dur: 500
});

在那之后,我想你会希望对象被抓住或继续跟随手,即使手在动画期间移动。您需要一个带有刻度方法的组件...伪代码:

tick: function (t, dt) {
  // Calculate vector between this.el (the object) and the hand.

  // Close the distance between the positions based on the duration you set and the timeDelta, using a velocity.

  // When the distance is small enough, you can either leave as it to have the object keep tracking the hand, or re-parent `this.el`'s object3D to the hand (handEl.object3D.add(this.el.object3D).
}
于 2018-06-19T04:16:49.127 回答