如何在 Spark AR (for Facebook) 中创建和使用按钮？

Question

我正在 Spark AR studio 使用 JavaScript 为 Facebook 制作简单的 AR 效果。我在场景中有两个 3D 对象，我想在单击按钮时在它们之间切换。

因此，例如，我有两个按钮，当我单击第一个按钮时，我想显示第一个 3D 对象（并隐藏另一个）。反之亦然 - 当我点击第二个按钮时，我想显示第二个 3D 对象并隐藏第一个。

我可以看到一些关于如何通过脚本访问场景中的对象的示例，但我还没有找到如何在 Spark AR 中创建或使用按钮的示例.

是否有任何简单的“拖放”方式来创建按钮并为其分配功能（如在 Unity 中）？或者我应该在场景中的 canvas 上创建按钮的图像，使用 JavaScript 来“找到”它，检测手指触摸是否在该图像上进行并以这种方式触发功能？

Answer 1

没有简单的 "drag-and-drop" 方法来创建按钮并为其分配功能。

您需要在场景中创建 canvas 按钮的图像，使用 Javascript 到 "find" 它，检测是否有手指触摸此图像并以这种方式触发一个功能。这是示例代码：

var Scene = require('Scene');
var TouchGestures = require('TouchGestures');

var myBtn = Scene.root.find('button');
TouchGestures.onTap(myBtn).subscribe(function() {
        //do stuff here
});

另外不要忘记在您的项目功能设置中启用点击手势。

Answer 2

您还可以使用本机 UI 选择器： https://developers.facebook.com/docs/ar-studio/docs/native-ui （我不确定问题发布时是否可用，我是游戏新手）

这更 "drag-and-drop" 因为你不必创建和放置按钮，只需分配纹理来填充它们，然后你可以编写脚本来做任何你想做的事情，当用户选择一个按钮。

如何在 Spark AR (for Facebook) 中创建和使用按钮？

How to create and use buttons in Spark AR (for Facebook)?

javascript

facebook

augmented-reality