首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >我的HTML5画布游戏总是在画面之间闪烁

我的HTML5画布游戏总是在画面之间闪烁
EN

Stack Overflow用户
提问于 2018-08-09 05:17:14
回答 1查看 68关注 0票数 1

我最近开始开发一个HTML5 RPG canvas游戏,并决定做一个类似于“文本框”的东西,但是当我编写它的时候,它开始在蓝色和文本框之间每隔一帧闪烁。是什么导致了这种情况呢?

代码:https://github.com/Codezters/RPG-Game-1

重要代码(我认为大多数球员移动的东西都是不相关的):

代码语言:javascript
复制
  function update() {
        if (realm == 'overworld') {
            cc.fillStyle='blue';
            cc.fillRect(0,0,c.width,c.height);
            cc.drawImage(bob, x, y);

            // Player Walk Animations 

            if (direction == 'up' && idleness == false) {
                if (walkstage > 0 && walkstage <4) {
                    document.getElementById("source").src = "IdleMoveUP1.png"
                }
                else if (walkstage > 3 &&  walkstage < 7) {
                    document.getElementById("source").src = "IdleUP.png"
                }
                else if (walkstage > 6 && walkstage < 10) {
                    document.getElementById("source").src = "IdleMoveUP2.png"
                }
            }
            else if (direction == 'right' && idleness == false) {
                if (walkstage > 0 && walkstage <4) {
                    document.getElementById("source").src = "IdleMoveRIGHT1.png"
                }
                else if (walkstage > 3 &&  walkstage < 7) {
                    document.getElementById("source").src = "IdleRIGHT.png"
                }
                else if (walkstage > 6 && walkstage < 10) {
                    document.getElementById("source").src = "IdleMoveRIGHT2.png"
                }
            }
            else if (direction == 'left' && idleness == false) {
                if (walkstage > 0 && walkstage <4) {
                    document.getElementById("source").src = "IdleMoveLEFT1.png"
                }
                else if (walkstage > 3 &&  walkstage < 7) {
                    document.getElementById("source").src = "IdleLEFT.png"
                }
                else if (walkstage > 6 && walkstage < 10) {
                    document.getElementById("source").src = "IdleMoveLEFT2.png"
                }
            }
            else if (direction == 'down' && idleness == false) {
                if (walkstage > 0 && walkstage <4) {
                    document.getElementById("source").src = "IdleMoveDOWN1.png"
                }
                else if (walkstage > 3 &&  walkstage < 7) {
                    document.getElementById("source").src = "IdleDOWN.png"
                }
                else if (walkstage > 6 && walkstage < 10) {
                    document.getElementById("source").src = "IdleMoveDOWN2.png"
                }
            }        
            if (idleframe == 8) {
                if (direction == 'down') {
                    document.getElementById("source").src = "IdleDOWN.png"
                    idleframe = 0;
                    idleness = true;
                }
                else if (direction == 'up') {
                    document.getElementById("source").src = "IdleUP.png"
                    idleframe = 0;
                    idleness = true;
                }
                else if (direction == 'right') {
                    document.getElementById("source").src = "IdleRIGHT.png"
                    idleframe = 0;
                    idleness = true;
                }
                else if (direction == 'left') {
                    document.getElementById("source").src = "IdleLEFT.png"
                    idleframe = 0;
                    idleness = true;
                }
                if (talking == true) {
                    if (wordcount != textBoxTest.length) {
                        cc.drawImage(textBox, 0, 400);
                        cc.fillStyle = "white";
                        console.log("this is working")
                        cc.fillText(counted, 0, 100);
                        counted += textBoxTest[wordcount]
                        wordcount++;
                    }
                    else if (EnterToggle == true) {
                        EnterToggle = false;
                        talking = false;
                    }

目前为止的游戏:https://codezters.github.io/RPG-Game-1/

解决方案:

当没有发生任何事情时,我不需要清理画布,所以我不太频繁地表明这一点,问题也就解决了。

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51755765

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档