A-Frame 前端WebVR以及后端Flask服务器搭建（二）

前面说的只是如何在网页里放置资源，这部分，讲讲交互。总体来说，A-Frame集成了两种交互，第一第二都是基于没有VR设备的交互，分别是模拟鼠标点击交互。第三种就是基于VR手柄的交互。

---

##模拟鼠标光标
在给相机添加光标：

可以看出，光标cursor是相机的子物体，相机移动时光标会保持在相机的正中心，默认这个光标是一个小的黑环，可以更改属性符合自己的审美。这个黑环就是我们在三维环境下模拟的鼠标，也是基于相机凝视的交互。

这个光标相当于相机正中发射一条射线，当它与第一个物体接触时发生你所定义的事件，比如改变一个正方体的颜色：

首先定义一个事件，change-color

设置发生这个事件的物体：

当然你可以设置多个这样的物体，只要添加change-color事件即可。

光标还可以设置提醒，比如光标射到什么物体显示物体的名称。

原理就是首先设置一个子物体显示提示文字，但默认不可见，当有射线时设置子物体可见即可。

---

##基于手柄的交互

我们需要在场景中定义手柄，在0.8.0版本中，给手柄添加了激光交互模块，定义如下：

laser包含了激光和手柄在三维世界中显示的模型，controller-cursor定义了手柄交互按键的映射，将射线当作光标来使用，也就是说它和光标组件的作用一致，raycaster和line共同绘制了激光。

如果没有controller-cursor那么你就需要自定义所有的按键映射，比如 triggerdown, triggerup等。
比如：

社区还有一个超级手模块，就是让手柄来模拟手，目前实现了
悬停（Hover）: 在实体的碰撞空间中握住控制器
抓住（Grab）: 按下一个按钮在实体上悬停或移动它
拉伸（Stretch）: 用双手抓住一个实体并调整大小
拖放（Drag-drop）: 将实体拖到另一实体上

这四个功能。不过相比前面的leap motion 来说，这个还是有点复杂。