Question

我试图克隆Flappy Bird，并且当用户发生碰撞时，我想停止动画帧并显示带有最后一个乐谱和按钮的页面。我尝试过了

function render(){
jumpCheck();
drawMovePipes();
writeScore();
interval=requestAnimationFrame(render)  
}

然后我通过隐藏开始屏幕并单击时显示游戏框架来开始窗口


$('startScreen').onclick=()=>{
    screen.canvas.style.display="block";
    $('startScreen').style.display="none";
     interval=window.requestAnimationFrame(render);
}

发生Collison后，此功能称为

function collided(){

    cancelAnimationFrame(interval);
    screen.canvas.style.display="none";
    $('h3').innerText+=`Last Score ${score}`
    $('startScreen').style.display="block";
}

这里的问题是循环不断运行，并不断重复添加“ last Score”文本。如何完全摆脱游戏暂停或退出之类的循环。完整代码位于https://github.com/whatevea/FlappyBirdJS 演示位于https://whatevea.github.io/FlappyBirdJS/Flappy%20Bird/

cancleAnimationFrame不会停止动画循环

0 个答案: