p5.js | noLoop()函数

noLoop()函数用于在执行 draw()函数后停止程序。 loop()函数一次又一次地运行 draw()函数。如果在 setup()函数中使用 noLoop()函数，那么它应该是块内的最后一行。如果使用 noLoop()函数，则无法在 mousePressed() 或 keyPressed() 等事件处理函数中更改或访问屏幕。

句法：

noLoop()

以下示例说明了 p5.js 中的 noLoop()函数：

示例 1：

function setup() {
    
  // Create canvas of given size
  createCanvas(500, 300);
    
  // Set the background color
  background('green');
    
  // Use noLoop() function
  noLoop();
}
  
function draw() {
    
  // Set the stroke color
  stroke('white');
    
  // Set the stroke width
  strokeWeight(4);
    
  // Function to draw the line
  line(50, 50, 450, 250);
    
}

输出：

示例 2：

let l = 0;
  
function setup() {
    
  // Create canvas of given size
  createCanvas(500, 300);
    
  // Set the background color
  background('green');
  
}
  
function draw() {
    
  // Set the stroke color
  stroke('white');
    
  l = l + 0.5;
  if (l > width) {
    l = 0;
  }
    
  // Function to draw the line
  line(l, 0, l, height);
    
}
  
function mousePressed() {
  noLoop();
}
  
function mouseReleased() {
  loop();
}

输出：