我们来分析下这个残影的实现原理:
1)黑色的画布背景
2)一个跟随鼠标运动的圆,填充色RGB为30,255,255
3)每一次 draw 绘制时,都会在画布上画一层和画布背景颜色的一样,但具有一定透明度的长方形...void draw() {
fill(30, 255, 255);
circle(mouseX, mouseY, 50);
}
很明显,我们在画布上不断的画圆,原来的圆会一直停留在画布上。...每次在 draw 中都填充下背景色,可以将之前画的圆全部擦除掉
void draw() {
background(0); // 每一次绘制,都填充下背景色
fill(30, 255, 255);...circle(mouseX, mouseY, 50);
}
因为每一次绘制都把画布填充了下,会把原来绘制的圆给擦除掉,所以最终呈现的效果如上 gif 图效果。...不清除画布,会导致圆按照轨迹不断叠加,形成一条圆组成的“线条“。填充背景色清除画布,会只看到一个圆跟随鼠标运动。
关键的地方来了,我们每次填充一个半透明画布大小的矩形会怎么样呢?