Spark AR ——动态实例化（二）【脚本】

本文已参与掘金创作者训练营第三期「高产更文」赛道，详情查看：掘力计划｜创作者训练营第三期正在进行，「写」出个人影响力。

Spark AR 是 Facebook 免费创作 AR 作品的平台，使用户能够为 Facebook 和 Instagram 创建交互式增强现实体验，超过 40 万名创作者，190个国家/地区，使用 Spark AR 来创作自己的AR作品

由于该软件无需任何编码知识即可使用，因此任何人现在都可以在 AR 世界中几乎没有经验地制作下一个疯狂式传播的 Instagram AR 特效，引领世界潮流。

专门的 AR 滤镜设计师单价甚至可达到 1000 美元到 3 万美元不等。

销毁动态对象

为了释放资源，最好的做法是销毁那些不再使用且不再被效果所需要的对象。这是通过调用由 SceneModule 和 MaterialsModule API 公开的 destroy() 方法来完成的。

销毁场景对象或材质将自动解除绑定属性，场景对象也将从任何父对象中移除。

只有动态对象可以通过调用 destroy() 方法来销毁。试图调用通过 Spark AR Studio UI 添加的对象或不存在的对象的该方法则会导致 Promise 失败。

在下面的例子中，当效果运行时，动态平面（plane）和材质被实例化，当轻击平面时，则它们将被销毁，并分别从场景和资产面板中移除。

 // Load in the required modules
const Scene = require('Scene');
const Materials = require('Materials');
const Textures = require('Textures');
              
// Enable the Touch Gestures > Tap Gesture capability 
// in the project's properties
const TouchGestures = require('TouchGestures');

// Enables async/await in JS [part 1]
(async function() {

    // Locate the focal distant object in the Scene and the two textures in the Assets panel
    const [focalDistance, texture] = await Promise.all([
         Scene.root.findFirst('Focal Distance'),
         Textures.findFirst('texture0'),
    ]);
              
    // Dynamically instantiate a plane and a material
    const [dynamicPlane, dynamicMaterial] = await Promise.all([

        Scene.create("Plane", {
            "name": "Plane",
            "width": 0.1,
            "height": 0.1,
            "y": -0.2,
            "hidden": false,
        }),

        Materials.create("DefaultMaterial", {
             "name": "Default Material",
             "blendMode": "ALPHA",
             "opacity": 1.0,
             "diffuse": texture,
        }),
    ]);

    // Set the dynamic material as the plane's material
    dynamicPlane.material = dynamicMaterial;

    // Add the Dynamic Plane as a child object of the Focal Distance object in the Scene panel so that it is rendered in the effect otherwise
    focalDistance.addChild(dynamicPlane);

    
    // Destroy the plane and material when the plane is tapped
    TouchGestures.onTap(dynamicPlane).subscribe(() => {
        Scene.destroy(dynamicPlane);
        Materials.destroy(dynamicMaterial);
    });
              
// Enables async/await in JS [part 2]
})();