如何從使用P5庫

這裏在Javascript了畫布的移動停止矩形是我的javascript：如何從使用P5庫

var x; 
var y; 
var ymod = 0; 

function setup() { 
    createCanvas(600, 600); 
    x = 10; 
    y = 12; 
} 

function draw() { 
    background(48, 48, 48); 
    noStroke(); 
    fill(255, 255, 255); 
    rect(x, y, 10, 30); 
    y = y + ymod; 
} 

function keyPressed() { 
    if (keyCode === UP_ARROW) { 
    ymod = -1; 
    } else if (keyCode === DOWN_ARROW) { 
    ymod = 1; 
    } 
}

這裏是我的HTML：

<!DOCTYPE html> 
    <head> 
    <meta charset="UTF-8"> 
    <title>Game</title> 
    <script src="libraries/p5.js" type="text/javascript"></script> 
    <script src="libraries/p5.dom.js" type="text/javascript"></script> 
    <script src="libraries/p5.sound.js" type="text/javascript"></script> 
    </head> 
    <body> 
    <script src="sketch.js" type="text/javascript"></script> 
    </body> 
</html>

我想矩形當它碰到畫布的邊緣時停止（即：y = 0和y = 570）。我試圖添加

if (y=0) { 
ymod = 0; 
}

到繪圖函數的結尾，但它打破了一切。

來源

2017-06-17 Tyler Wright student

這可以使用在p5.js的constrain功能，約束y 570之間0和完成，像這樣：

y = constrain(y, 0, 570);

爲什麼if (y = 0)減免一切都是因爲一個等號套y的緣故0代替比較。要測試y = 0，您需要改爲使用三重等號（y === 0）。

來源

2017-06-17 20:45:10

如何從使用P5庫

回答

相關問題