Question

主要物体持续射击子弹，它看起来像一个激光。我不知道怎么用按键敲一下子弹。我需要使用间隔吗？

var gameBullet=[];
var i=0;
//Starts game
function startGame() {
    myGameArea.start();
    myGamePiece= new component(20,20,"red",10,120);

}
//Creates canvas , events and how many times per sec should the object redraw
var myGameArea = {
    canvas : document.createElement("canvas"),
    start : function() {
        this.canvas.width = 480;
        this.canvas.height = 270;
        this.context = this.canvas.getContext("2d");
        document.body.insertBefore(this.canvas, document.body.childNodes[0]);
        this.interval = setInterval(updateGameArea, 1);

        window.addEventListener('keydown', function (e) {
            myGameArea.keys = (myGameArea.keys || []);
            myGameArea.keys[e.keyCode] = (e.type == "keydown");
        })
        window.addEventListener('keyup', function (e) {
            myGameArea.keys[e.keyCode] = (e.type == "keydown");
        })
        window.addEventListener('space',function(e){
            myGameArea.keys[e.keyCode] = (e.type == "space");
        })
    },
    clear: function(){
        this.context.clearRect(0,0,this.canvas.width,this.canvas.height);
    }
}
//Bullet constructor
function bullet(width,height,color,x,y){
    this.gamearea=myGameArea;
    this.width=width;
    this.height=height;
    this.speedX=5;
    this.x=x;
    this.y=y;
    this.update = function(){
        ctx=myGameArea.context;
        ctx.fillStyle = color;
        ctx.fillRect(this.x, this.y, this.width, this.height);
    }
    this.newPos = function(){
        this.x+=this.speedX;
        this.hitBorder();
    }
    this.hitBorder = function() {
        var right = myGameArea.canvas.width - this.width;
        if (this.x > right) {
            this.x = right;
        }
    }
}
//Main Object constructor
function component(width,height,color,x,y){
    this.gamearea=myGameArea;
    var imageObj = new Image();
    this.width=width;
    this.height=height;
    this.speedX=0;
    this.speedY=0;
    this.x=x;
    this.y=y;
    this.update= function(){
        ctx=myGameArea.context;

    /*        ctx.drawImage(imageObj,this.x,this.y, this.width, this.height);

          imageObj.src = 'stalin.png';
        */
        ctx.fillStyle = color;
        ctx.fillRect(this.x, this.y, this.width, this.height);
    }
    this.newPos= function(){
        this.x+=this.speedX;
        this.y+=this.speedY;
        this.hitBorder();
    }
    this.hitBorder = function() {
        var down = myGameArea.canvas.height - this.height;
        if (this.y > down) {
            this.y = down;
        }
        if (this.y < 0) {
            this.y = 0;
        }
        var right = myGameArea.canvas.width - this.width;
        if (this.x > right) {
            this.x = right;
        }
        if (this.x < 0) {
           this.x = 0;
        }
    }
}

我认为这是问题所在。我需要在循环中添加一些内容，但我不知道是什么。

//Updates game 
function updateGameArea() {
    myGameArea.clear();
    myGamePiece.speedX = 0;
    myGamePiece.speedY = 0;

    if (myGameArea.keys && myGameArea.keys[37]) {myGamePiece.speedX = -1; }
    if (myGameArea.keys && myGameArea.keys[39]) {myGamePiece.speedX = 1; }
    if (myGameArea.keys && myGameArea.keys[38]) {myGamePiece.speedY = -1; }
    if (myGameArea.keys && myGameArea.keys[40]) {myGamePiece.speedY = 1; }
    if (myGameArea.keys && myGameArea.keys[32])
    {
        gameBullet[i]=new bullet(5,5,"red",myGamePiece.x,myGamePiece.y);
        i=i+1;
    }

    myGamePiece.newPos();
    myGamePiece.update();
    for( i=0;i<gameBullet.length;i+=1){
        gameBullet[i].newPos();
        gameBullet[i].update();
    }
}
startGame();

Answer 1

您可以使用setinterval（）代替for循环

setinterval(yourcode,timespan);

如何让我的物体一个接一个地射击子弹？

1 个答案: