0

为清楚起见进行编辑：

这个问题的上下文不在javascript / html的上下文中。它在 javascript Spark AR studio 的上下文中。典型的 html / css / javascript 方法不起作用。我只有通过这个应用程序使用 javascript 的经验，这是我第一次学习任何东西。我在下面列出了对我有用的内容。

我在移动 ar 应用程序中有三个资产需要在点击时进行交换，以便每次点击都会关闭当前项目的可见性并切换下一个项目的可见性。我可以监控水龙头并订阅该事件。我可以制作资产*.hidden = true，false但我不确定交换它们所需的逻辑。

我会为点击创建一个计数功能（限制为三个？）然后根据生成的数字使用 if/then 来隐藏/取消隐藏？

我以前真的只用 Python 和一些 js 编写过脚本，但我对代码感到好奇，我会在 JavaScript 中使用什么约定来解决这样的难题？成功可能是什么样子？

4

2 回答 2

0

只是提醒一下，我终于想出了如何做我需要做的事情，它看起来像这样：

const TouchGestures = require('TouchGestures');
const Scene = require('Scene');
const D = require('Diagnostics');

//scene assets:
const asset1 = Scene.root.find('plane0');
const asset2 = Scene.root.find('plane1');
const asset3 = Scene.root.find('plane2');
//assets put into array:
const myArray = [asset1,asset2,asset3];
//initial visibility state for assets:
var hideStates = [0,1,1];
//set initial visibility:
hide(myArray,hideStates);



//MAIN EVENT___________________________________________________________________________________
TouchGestures.onTap().subscribe(function (gesture) { // cycle visibility for assets on event

    var hideStates = [1,1,1];
    hide(myArray,hideStates);
    unHide(myArray);

});

//_____________________________________________________________________________________________

//this will move through an array one step at a time, returning the index...
var cycler = {
    current: -1,
    cycle: function(arr) {
        if (this.current == arr.length -1) {
            this.current = 0;
        } else {
            this.current++;
        }
        return this.current;
    }
};


function hide(assets,states) {
    for (var i = 0; i <assets.length; i++) {
        assets[i].hidden = states[i];
    }
};

function unHide(assets) {
    var unhide = cycler.cycle(myArray);
    myArray[unhide].hidden = 0;
};

不确定这是否是最好的做事方式，但它确实有效！

于 2019-03-10T07:18:39.790 回答
0

以下是如何使用 Javascript 点击一组资产（在本例中为input元素）的示例，一次只显示一个资产：

var ix = 0;

var assets = ["x1","x2","x3"].map(
  function(x) {return document.getElementById(x);}
);

function showNextAsset() {
  assets[ix++].style.display = "none";
  assets[ix = (ix < assets.length) ? ix : 0].style.display = "block";
}
<form onclick="showNextAsset(); return false;">

<input id="x1" value="foo">
<input id="x2" value="bar" style="display:none">
<input id="x3" value="toto" style="display:none">

</form>

于 2018-12-13T02:57:04.637 回答