p5.js | noFill()函数

简介

noFill()是p5.js中的一个函数，可以用来设置图形的边框不填充颜色。在调用之后，p5.js会将之后所有的图形的边框都变成不填充颜色。

语法

noFill(); 

参数

该函数无需参数。

返回值

该函数没有返回值。

样例

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  stroke(255, 0, 0); // 设置画线颜色为红色
  noFill(); //设置边框不填充颜色
  rect(50, 50, 200, 200); //绘制边框为红色的矩形，但是中间不填充颜色
}

代码结果：

如上所示，我们调用了 noFill() 函数设置边框不填充颜色，因此中间不会显示任何填充色，只有红色的边框。

注意事项

• noFill()函数只有在之后的图形中才会生效，如果之前已经设置了图形的填充颜色并使用 fill() 函数绘制了图形，那么之前的图形填充颜色将无法消除。
• 如果在绘制图形之前调用 noFill() 函数，p5.js会将之后所有图形的边框都设置为不填充颜色，包括线段和点。如果想只影响后续矩形、椭圆等图形的填充颜色，那么可以将 noFill() 函数放置在对应的绘制函数前。