Processing中实现按键盘1/2键切换控制正方形与圆形移动的问题求助

你的代码目前存在几个关键问题导致无法正常工作：

1. 共用坐标与未区分图形：MyShape类里的x、y是共用的，调用move()时会同时改变矩形和圆形的位置，而且两个图形的绘制位置基于同一个x、y偏移，导致它们会重叠或者同步移动，不符合你“分别控制”的需求。
2. 缺少选中状态管理：没有变量记录当前正在控制的是哪个图形，无法让移动逻辑只作用于选中的目标。
3. 未初始化坐标：x、y默认初始值是0，你的绘制位置是200+x和100+x，如果没有初始化，第一次显示的位置可能不符合预期，甚至可能超出画布（虽不是核心问题，但会影响体验）。

我们可以通过以下调整来实现需求：

1. 让MyShape类支持绘制不同类型的图形，每个实例对应一个独立图形。
2. 添加变量记录当前选中的图形，让移动逻辑只作用于选中的实例。
3. 处理键盘按键1和2来切换选中的图形。

修改后的完整代码 #

MyShape类 #

class MyShape{
  int x, y;
  int shapeType; // 0 = 正方形, 1 = 圆形

  // 构造函数，初始化位置和图形类型
  MyShape(int startX, int startY, int type){
    x = startX;
    y = startY;
    shapeType = type;
  }

  // 根据类型绘制图形
  void display(){
    stroke(255); // 白色描边，在黑色背景上更清晰
    fill(100); // 填充灰色
    if(shapeType == 0){
      rect(x, y, 50, 50);
    } else if(shapeType == 1){
      ellipse(x, y, 50, 50);
    }
  }

  // 移动逻辑，只在被选中时生效
  void move(){
    if(keyPressed && key == CODED){
      if(keyCode == LEFT){
        x--;
      } else if(keyCode == RIGHT){
        x++;
      } else if(keyCode == UP){
        y--;
      } else if(keyCode == DOWN){
        y++;
      }
    }
  }
}

主程序代码 #

MyShape square;
MyShape circle;
MyShape currentSelected; // 记录当前选中的图形

void setup(){
  size(400,400);
  // 初始化正方形和圆形的初始位置
  square = new MyShape(200, 200, 0);
  circle = new MyShape(100, 100, 1);
  // 默认选中正方形
  currentSelected = square;
}

void draw(){
  background(0);
  // 绘制两个图形
  square.display();
  circle.display();
  // 只移动当前选中的图形
  currentSelected.move();
}

// 处理按键切换选中的图形
void keyPressed(){
  if(key == '1'){
    currentSelected = square;
    println("现在控制正方形");
  } else if(key == '2'){
    currentSelected = circle;
    println("现在控制圆形");
  }
}

关键改进点说明 #

• 独立的图形实例：创建了两个MyShape实例，分别对应正方形和圆形，它们拥有各自的坐标，移动时不会互相影响。
• 选中状态管理：用currentSelected变量记录当前要控制的图形，move()方法只作用于这个实例。
• 按键切换逻辑：新增keyPressed()函数，监听1和2键来切换选中的图形，同时打印提示信息方便确认操作状态。
• 初始化优化：通过构造函数初始化每个图形的初始位置和类型，避免坐标未赋值的问题，同时让代码结构更清晰。

现在运行代码后，按下1键可以控制正方形移动，按下2键可以切换到控制圆形，两个图形的移动完全独立，不会互相干扰。

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