在Processing中能否用形状创建图层蒙版，为相交/分割形状填充多色/图案？

问题1：是否可以使用形状创建图层蒙版，再为蒙版区域填充其他颜色或图案？ #

可以，核心通过PGraphics离屏缓冲+mask()方法实现，实现步骤如下：

• 先创建内容PGraphics对象，在其中绘制你需要的填充色、渐变、图案等任意内容
• 再创建蒙版PGraphics对象，绘制自定义形状作为蒙版（蒙版中白色区域为最终显示区域，黑色区域为透明区域）
• 调用内容对象的mask()方法传入蒙版对象，将处理后的内容绘制到主画布即可

示例代码：

PGraphics content, maskShape;

void setup() {
  size(400, 400);
  // 绘制填充内容：彩色渐变
  content = createGraphics(400, 400);
  content.beginDraw();
  for (int i = 0; i < 400; i++) {
    content.stroke(i, 150, 200);
    content.line(i, 0, i, 400);
  }
  content.endDraw();
  
  // 绘制蒙版：圆形
  maskShape = createGraphics(400, 400);
  maskShape.beginDraw();
  maskShape.background(0);
  maskShape.fill(255);
  maskShape.ellipse(200, 200, 300, 300);
  maskShape.endDraw();
  
  // 应用蒙版
  content.mask(maskShape);
}

void draw() {
  background(255);
  image(content, 0, 0);
}

问题2：当形状与底层形状相交、或是被线条分割时，能否为同一形状的不同区域填充不同的颜色或图案？ #

可以，根据场景不同有两种常用实现方案：

• 形状相交场景：使用PShape创建多个相交的子形状，每个子形状单独设置填充样式，再将所有子形状加入同一个形状组，视觉上呈现为一个整体的相交图形，不同区域填充效果独立
• 线条分割场景：以你提到的正方形被对角线分割为例，直接将分割后的两个三角形作为独立子形状添加到同一个PShape组中，即可分别设置两个区域的填充效果

示例代码（正方形对角线分割分区域填充）：

PShape squareGroup;

void setup() {
  size(400, 400);
  squareGroup = createShape(GROUP);
  
  // 左上三角形
  PShape tri1 = createShape(TRIANGLE, 50, 50, 350, 50, 50, 350);
  tri1.setFill(color(255, 100, 100));
  squareGroup.addChild(tri1);
  
  // 右下三角形
  PShape tri2 = createShape(TRIANGLE, 350, 350, 350, 50, 50, 350);
  tri2.setFill(color(100, 255, 100));
  squareGroup.addChild(tri2);
}

void draw() {
  background(255);
  shape(squareGroup, 0, 0);
}

内容的提问来源于stack exchange，提问作者Zhixian Chin