如何使用 Metaio 动态更改图像

Question

我刚刚开始学习Metaio。我正在做一个简单的开发测试项目。

到目前为止，我已经进行了跟踪 sheet，放置图像和两个箭头（按钮），表示下一张图像和上一张图像。

为了测试，我制作了一个按钮来显示图像，另一个按钮用于隐藏图像。到目前为止一切正常。

我的问题 是当我添加额外的图像时如何使用下一个和上一个按钮动态前后移动图像？

我的测试代码：

button2.onTouchStarted = function () {
    image1.hide();
};

button1.onTouchStarted = function () {
    image1.display();
};

Answer 1

可以用不同的方式完成，我建议你使用 arel.Scene.getObject 并将你的图像名称放在数组中，每次你单击下一个或上一个时，你都会向上或向下计数数组键。

我假设您使用的是 Metaio Creator 编辑器。

您必须在 3 个不同的地方添加代码：

上一个（左箭头按钮）

button1.onTouchStarted = function () {  
    if (currentImageIndex == firstImageIndex) {
        return;
    }
    arel.Scene.getObject(imageArray[currentImageIndex]).hide();
    currentImageIndex--;
    arel.Scene.getObject(imageArray[currentImageIndex]).display();
    globalsVar['currentImageIndex'] = currentImageIndex;

};

下一步（右箭头按钮）

button2.onTouchStarted = function () {
    if (currentImageIndex == lastImageIndex) {
        return;
    }
    arel.Scene.getObject(imageArray[currentImageIndex]).hide();
    currentImageIndex++;
    arel.Scene.getObject(imageArray[currentImageIndex]).display();
    globalsVar['currentImageIndex'] = currentImageIndex;
};

在您的全局脚本上

var imageArray = ["image1", "image2"]; // and so on extra image names
var firstImageIndex = 0;
var lastImageIndex = imageArray.length - 1;
var currentImageIndex = firstImageIndex;
globalsVar = {};

arel.Scene.getObject(imageArray[currentImageIndex]).display();

如何使用 Metaio 动态更改图像

How to dynamically change images using Metaio

metaio