第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時綁定郵箱和手機立即綁定
已解決430363個問題，去搜搜看，總會有你想問的

在 javascript 上制作“Atari Breakout”類型的游戲。

在 javascript 上制作“Atari Breakout”類型的游戲。

DIEA 2022-11-03 11:01:08
我想知道如何創(chuàng)建當被球擊中時消失的磚塊，而不是手動繪制每一塊磚塊。手動，我的意思是創(chuàng)建每一塊磚，并為每一塊磚使用 if 語句來檢查球是否擊中。我已經(jīng)完成了所有其他事情，這是我到目前為止的代碼：提前謝謝你......    <body>    <canvas height="400" width="400" id="myCanvas"></canvas>           <script>        "use strict"        var a=document.getElementById("myCanvas");        var c=a.getContext("2d");        var platformX=170;        var speed=0;        var ballX=200        var ballY=50;        var ballSpeed=0;        var ballBounce=0;        var ballRadius=10;        var interval=window.setInterval(createBall,17);        var bullets=[];                c.fillStyle="white";        c.beginPath();        c.rect(platformX,350,40,30);        c.fill();        c.closePath();                c.fillStyle="green";        c.beginPath();        c.arc(200,ballY,10,0,2*Math.PI);        c.fill();        c.closePath();                window.onkeydown=function(e){            if(e.keyCode==37){                speed=-6;            }            if(e.keyCode==39){                speed=6;            }            if(e.keyCode==32){                ballSpeed=2;                            }        }                window.onkeyup=function(e){            if(e.keyCode==37){                speed=0;            }            if(e.keyCode==39){                speed=0;            }        }                function movePlatform(){            platformX+=speed;             c.clearRect(0,350,400,50);            c.fillStyle="white";            c.beginPath();            c.rect(platformX,350,80,20);            c.fill();            c.closePath();    }        window.setInterval(movePlatform,17);                function createBall(){            ballY+=ballSpeed;            ballX+=ballBounce;            c.clearRect(0,0,400,350);            c.fillStyle="green";            c.beginPath();            c.arc(ballX,ballY,ballRadius,0,2*Math.PI);            c.fill();    </script></body>
查看完整描述

1 回答

?
子衿沉夜

TA貢獻1828條經(jīng)驗 獲得超3個贊

您可以定義將創(chuàng)建磚對象的對象構(gòu)造函數(shù)。然后，您可以從此對象讀取磚塊的屬性以進行渲染。


function Brick(x,y,width,height){ // as inputs you take the position and size

this.x = x; // adding attributes to the object based on the values that were entered

this.y = y;

this.width = width;

this.height = height;

}

當我們要創(chuàng)建一個brick對象時，我們調(diào)用函數(shù)如下：


var brick = new Brick(x,y,width,height); //whatever values you want it to have

解決方案的第二部分是將所有磚對象存儲在一個數(shù)組中：


var bricks = [];//initialise the array

var brickWidth = 30;//the default dimensions of the bricks. Change these to be whatever you want

var brickHeight = 10;

var xBrickPadding = 5;//the default spacing between bricks

var yBrickPadding = 5;

var minX = 0; // the dimensions of the area in which you want your bricks to be

var maxX = 100;

var minY = 0;

var maxY = 50;


//when you want to add your bricks to the array, probably at the start of the game or whenever you refresh, use a loop like this:

for(let x = minX; x<maxX; x+= brickWidth+xBrickPadding){ //loop over the x coordinates

   for(let y = minY; y<maxY; y+= brickHeight+yBrickPadding){//loop over the y coordinate

      bricks.push(new Brick(x,y,brickWidth,brickHeight)); //add our new brick to the array at each x and y position

   }

}

我們現(xiàn)在在適當?shù)奈恢糜幸粋€充滿磚塊的數(shù)組，但是我們需要在屏幕上渲染它們。讓我們定義一個 renderBricks 函數(shù)，這樣我們就不必在每個動畫幀都渲染它們，只有當我們需要更新它們時：


renderBricks = function(){

   for(brick of bricks){//loop over every brick stored in the array

      c.beginPath();

      c.rect(brick.x,brick.y,brick.width,brick.height);//read the relevant properties from the brick object in order to render it

      c.fill();

      c.closePath();

   }

}

代碼的最后一部分是在磚塊被擊中時移除磚塊的邏輯。將此代碼添加到您的 createBall 函數(shù)中，以便在每次球的位置更改時檢查它。


for(brick of bricks){//loop over every brick

   if(){//insert your condition here to check if the ball has collided or not. You can use the properties brick.x, brick.y, brick.width and brick.height

      bricks.splice(bricks.indexOf(brick),1); //if so, remove the brick from the array

      renderBricks(); // then, render the bricks again so the brick no longer appears on the screen

   }

}

這是解決您的問題的一種可能方法。希望能幫助到你！


查看完整回答
反對 回復 2022-11-03
  • 1 回答
  • 0 關(guān)注
  • 128 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

 公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號