Question

我似乎无法在p5.js参考页面上找到有关如何在通过createCanvas（）创建的画布上转角的任何信息。对于矩形，这是可能的，因为函数采用的第五个输入是边界半径。创建画布时不是这种情况。

我举了一个小例子，展示了一个内部有一个弯角矩形的平角画布，我的目的是反映在画布的形状上。

任何帮助将不胜感激。感谢。

function setup() {
  createCanvas(200,200);
}

function draw() {
  background(32);
  rectangle();
}

function rectangle() {
  stroke(255);
  fill(255,255,255,100);
  rect(70,70,60,60,10);
}

<head>
  <script src="//cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.10/p5.js"></script>
</head>
<body>
</body>

Answer 1

function setup() {
  createCanvas(200,200);
}

function draw() {
  background(32);
  rectangle();
}

function rectangle() {
  stroke(255);
  fill(255,255,255,100);
  rect(70,70,60,60,10);
}

canvas {
  border-radius: 12px;
}

<head>
  <script src="//cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.10/p5.js"></script>
</head>
<body>
</body>

你想得到类似的东西吗？通过css我将黑色帆布容器弄圆。

在p5.js

1 个答案: