p5.js | strokeCap()函数

简介

strokeCap()函数是p5.js中用来设置线段端点样式的函数。它有三个预定义的参数：ROUND,SQUARE,PROJECT和一个可选参数butt。默认参数是ROUND，所以除非你自己改变了参数，你不需要调用这个函数。

语法

strokeCap(mode);

参数

• mode： 取值为ROUND,SQUARE,PROJECT或可选参数butt。 默认值为ROUND。

示例

示例1

function setup() {
  createCanvas(400, 400);
  stroke(255);
  strokeWeight(10);
  line(50, 30, 350, 30);
  strokeCap(ROUND);
  line(50, 60, 350, 60);
  strokeCap(SQUARE);
  line(50, 90, 350, 90);
  strokeCap(PROJECT);
  line(50, 120, 350, 120);
}

示例2

function setup() {
  createCanvas(400, 400);
  strokeWeight(10);
  stroke(255, 0, 0);
  strokeCap(ROUND);
  line(50, 30, 350, 30);
  strokeCap(SQUARE);
  line(50, 60, 350, 60);
  strokeCap(PROJECT);
  line(50, 90, 350, 90);
  strokeCap(BUTT);
  line(50, 120, 350, 120);
}

总结

strokeCap()函数是p5.js中用来设置线段端点样式的函数。它可以使我们的线段具有不同的形状，如圆形、方形和项目形式。如果你想要改变线段的端点样式，使用strokeCap()函数可以轻松实现。