Processing开发2D游戏窗口向左倾斜偏移问题求助

你遇到的画面向左倾斜、右侧留白、左侧内容裁切的问题确实由代码逻辑导致，核心原因是rectMode(CENTER)的设置与矩形绘制的坐标逻辑不匹配：

当启用rectMode(CENTER)后，rect()函数的前两个参数代表矩形的中心坐标，但你的代码中计算坐标时使用的是kockaWidth * i、kockaHeight * j这类左上角坐标的逻辑，导致所有矩形整体向左上偏移了半个矩形的尺寸，最终出现画面偏移和裁切的现象。

以下是两种可行的解决方法：

方案一：移除rectMode(CENTER)设置 #

直接删除setup()中的rectMode(CENTER);语句，让rect()函数默认使用左上角坐标模式，与当前的坐标计算逻辑匹配，即可让网格铺满整个窗口。

修改后的setup()代码：

void setup() {
  size(300, 300);
  for(int i = 0; i < red; i++)
  {
    for(int j = 0; j < kolona; j++)
    {
      if(random(100) < 20 && j != 50 && i != 20)
      {
        grid[i][j] = true;
      }
    }
  }
  // 移除rectMode(CENTER)设置
}

方案二：调整坐标适配CENTER模式 #

如果需要保留rectMode(CENTER)，则需要将每个矩形的坐标调整为中心位置，即在原坐标基础上加上半个矩形的宽高，玩家坐标也需要同步调整：

修改后的draw()核心代码：

void draw() {
  int kockaWidth = width/red;
  int kockaHeight = height/kolona;
  for(int i = 0; i < red; i++)
  {
    for(int j = 0; j < kolona; j++)
    {
      float rectCenterX = kockaWidth * i + kockaWidth/2;
      float rectCenterY = kockaHeight * j + kockaHeight/2;
      if(grid[i][j])
      {
        fill(255,0,0);
        rect(rectCenterX, rectCenterY, kockaWidth,kockaHeight);
      }
      else
      {
       stroke(1);
       fill(160,160,160);
       rect(rectCenterX, rectCenterY, kockaWidth,kockaHeight);
      }
    }
  }
  float playerPixelX = playerIndexX * kockaWidth + kockaWidth/2;
  float playerPixelY = playerIndexY * kockaHeight + kockaHeight/2;
  fill(0, 255, 0);
  rect(playerPixelX, playerPixelY, kockaWidth, kockaHeight);
}

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