小编ste*_*lin的帖子

我有一个问题让我的KineticJS动画停止().

我在同一层上有三个KineticJS图像对象,我已经为每个KineticJS图像对象添加了一个KineticJS动画.但是,只有一个图像对象显示任何动画.它也不会停止响应anim.stop()的动画,除非我停止()所有三个对象(包括那些实际上没有视觉动画的动画)的动画.

我的问题是:是否可以在单个图层上添加多个独立动画到单个图层,并且仍能够单独启动()/停止()每个动画？或者我是否需要为每个KineticJS图像对象创建单独的图层？

简而言之(黑客版本),我的代码如下:

stage = new Kinetic.Stage({container: "container", width: windowWidth, height: windowHeight});

layer = new Kinetic.Layer();

var kinObjArr = [];

for (var i=0; i < 3; i++) {
    kinObjArr[i] = new Kinetic.Image({image: myHTMLImage});

    kinObjArr[i].anim = new Kinetic.Animation({
        func: function(frame) {
            kinObjArr[i].setX(30 * Math.sin(frame.time * 2 * Math.PI / 500) + 100);
        },
        node: layer
    });

    kinObjArr[i].anim.start();

    kinObjArr[i].on('touchstart', function(){
        this.anim.stop();    // <----- Doesn't stop
        layer.draw();
    });

} // for

stage.add(layer);

基本上只有列表中的最后一个KineticJS图像将被动画化,并且只有在触摸/点击所有3个图像时才能停止它.