如何在Processing中用循环实现无限嵌套的圆圈迷幻动画

你现有代码无法生成嵌套效果的核心问题：每次生成圆时都随机选取圆心坐标，所有圆的位置是分散的，没有共享同一中心点，因此无法形成层层套叠的视觉效果。

核心实现逻辑 #

不需要硬编码每一层圆的尺寸，只要顺着同心圆的缩放规律写循环即可：

• 给每组嵌套圆固定唯一的公共圆心，所有内层圆都以这个点为中心绘制
• 定义每层圆的直径缩放规则，从外层最大直径开始，逐次按固定比例缩小
• 当直径缩小到接近0时自动退出循环，就能实现视觉上的“无限嵌套”效果，不需要手动数有多少层
• 搭配位置、比例的随机扰动，就能做出迷幻的动态效果

适配你现有代码的可运行版本 #

int m = millis();

void setup(){
  size(1136, 936);
  ellipseMode(CENTER);
}

void draw(){
  frameRate(1.3);
  background(255);
  
  if (millis() > m + 1000){
    // 每帧随机生成5组独立的嵌套圆簇
    for (int groupIdx = 0; groupIdx < 5; groupIdx++){
      // 固定当前这组嵌套圆的公共圆心
      float centerX = random(0, width);
      float centerY = random(0, height);
      // 当前组的最大外层圆直径
      float maxCircleDiameter = random(200, 500);
      
      // 循环绘制所有嵌套层：直径从最大值开始，每次按0.55倍比例缩小
      // 直到直径小于1像素就停止循环，视觉上就是无限延伸的嵌套效果
      for (float d = maxCircleDiameter; d > 1; d = d * 0.55){
        // 黑白交替填充，匹配高对比的迷幻视觉
        if (int(d) % 2 == 0){
          fill(0);
        } else {
          fill(255);
        }
        circle(centerX, centerY, d);
      }
    }
    m = millis();
  }
}

可自定义调整的参数 #

• 缩放比例：把代码里的0.55调大（比如0.7），嵌套的层数会变多，圆间距更密；调小（比如0.4），大圈的视觉占比会更高
• 颜色效果：开启colorMode(HSB)后，把填充值替换为随直径渐变的随机色相，就能做出彩色迷幻效果
• 圆簇密度：把groupIdx <5的数值改大，画布上的嵌套圆簇会分布得更密集

内容的提问来源于stack exchange，提问作者bonky monkey