Question

我正在使用画布中的动画场景，其中我有一个基类Sprite - 我的项目中除了一个对象之外的所有对象都使用单继承，就像刚从Sprite继承一样。

我有一个从Sprite继承的静态动画精灵对象，这个动画精灵只是将剪裁区域移动到精灵表格上。它按预期动画，即在翻页时没有闪烁。

但是我有一个移动的动画精灵，并且为了节省代码空间，我从AnimatedSprite继承了这个，所以这个精灵继承自一个继承自对象的对象。

这个新精灵正在闪烁每一帧转换，我想知道双重继承是否可能导致问题？在搜索所有三个对象的原型以查找函数调用时？

很抱歉，在没有尝试的情况下，这有点懒惰，代码库相当大，今晚我没有时间使用单继承模型重写对象。

所以对此的任何评论都将不胜感激！

记录中我是双缓冲。

继承功能：

function __extends(child,parent){ //Global function for inheriting from objects
       function Temp(){this.constructor = child;} //Create a temporary ctor
       Temp.prototype = parent.prototype; 
       child.prototype = new Temp(); //Set the child to an object with the child's ctor with the parents prototype
}

切换帧：

SantaSprite.prototype.loopImages = function(){

    if(this.getDirection()){ //If going right set the y frame to the bottom of the sheet
        this.setCurrentFrame(this.getCurrentFrame().getX(),this.getFrameHeight());
    }
    else{ //Else set y to the top of the sheet
        this.setCurrentFrame(this.getCurrentFrame().getX(),0);
    }

    this.setSwitchTime(this.getSwitchTime()+this.getIncrement()); //Increment the timer

    if(this.getSwitchTime() >= this.getSwitchFrame()){ //If the counter has reached the limit

        this.setSwitchTime(0); //Reset the counter

        //Move the frame along one tile in the x axis
        this.setCurrentFrame(this.getCurrentFrame().getX() + this.getFrameWidth());

        //If at the end of x axis, reset back to 0 (left)
        if(this.getCurrentFrame().getX() + this.getFrameWidth() > this.getImage().width){
            this.setCurrentFrame(0,this.getCurrentFrame().getY());
        }
    }

};

干杯

Answer 1

这里的错误就在这一行：

//Move the frame along one tile in the x axis
    this.setCurrentFrame(this.getCurrentFrame().getX() + this.getFrameWidth()); //No Y value set.

修复：

//Move the frame along one tile in the x axis
    this.setCurrentFrame(this.getCurrentFrame().getX() + this.getFrameWidth(),
                         this.getCurrentFrame().getY());

Html5画布，继承层次可能导致闪烁？

1 个答案: