无法使用pixijs和pixi-animate添加子级

时间:2018-06-23 14:18:37

标签: pixijs adobe-animate

我正在使用PixiJs 4.4.2和Pixi-animate加载Adobe animate生成的阶段。在我的项目中,

我已将项目划分为多个组件,并为每个组件生成了Adobe阶段pixijs代码。现在想将它们合并为一个项目。我已经成功地将一个组件加载为主阶段,但无法将其他组件加载为子级。

这是我的代码,我在其中装载了我的主要阶段:

var waterfall = lib.Waterfall_PixiAnimate;
var bear = lib.reference_BearLevel_PixiAnimate;

var salmon = new PIXI.animate.Scene(3840, 2160, {}, true)
document.body.appendChild(salmon.view);
salmon.load(waterfall)

在上面的代码中,我成功添加了瀑布舞台,但是在该舞台上,我想渲染我的子舞台 bear ,但不能在瀑布舞台上进行渲染。< / p>

如何添加子阶段?

1 个答案:

答案 0 :(得分:0)

一种方法是将项目发布到同一文件夹,在发布设置中为其赋予不同的阶段名称和名称空间。...(对不起,我无法发布图像,没有足够的代表!)

...然后通过使用一个场景将它们组合在一起,但是为每个导出的js文件调用加载。

<div id="test">
  <input><br><img>
</div>

或者,如果您已经拥有自己的pixi应用程序或舞台,则可以绕过场景,而单独使用pixi-animate load函数(为简便起见,在ES6中使用):

<canvas id="stage" width="550" height="400"></canvas>
<script src="libs/pixi.js"></script>
<script src="libs/pixi-animate.js"></script>
<script src="square.js"></script>
<script src="circle.js"></script>
<script>
    var scene = new PIXI.animate.Scene(550, 400, {
        view: document.getElementById("stage"),
        backgroundColor: 0xffffff,
        antialias: true
    });
    scene.load(lib1.circle);
    scene.load(lib2.square);
</script>