Question

以下代码用于在屏幕上绘制蓝色背景和三个移动形状（圆形，方形，三角形）。但是，代码是用面向对象的编程编写的，并且有些错误，因为我的草图在Processing IDE的Java模式下完美地工作但在OpenProcessing中无法工作。代码编译完美。我假设我在某种程度上对OOP做了一些不正确的事情。谁能帮帮我吗？谢谢！

Circle circle = new Circle(PI,200,400,400);
Square square = new Square(100,100);
Triangle triangle = new Triangle(400,400);
void setup() {
  size(800,800);
  rectMode(CENTER);
  ellipseMode(CENTER);
  noStroke();
  frameRate(120);
}
void draw() {
  background(0,0,255);
  circle.drawCircle();
  square.drawSquare();
  triangle.drawTriangle();
}
void shadeOfOrange(int x) {
  fill(255,128-x,0);
}
class Circle {
  float offsetX = 0;
  float offsetY = 0;
  float circleScalar;
  float angle;
  float circleStep = 0.005;
  Circle(float initialAngle,float radius,float offsetX,float offsetY) {
    angle = initialAngle;
    circleScalar = radius;
    this.offsetX = offsetX;
    this.offsetY = offsetY;
  }
  void drawCircle() {
    pushMatrix();
    for(int i = 100; i >= 1; i--) {
      shadeOfOrange(i);
      float x1 = offsetX + circleScalar*cos(angle);
      float y1 = offsetY + circleScalar*sin(angle);
      ellipse(x1,y1,i,i);
    }
    popMatrix();
    this.incrementAngle();
  }
  void incrementAngle() {
    angle += circleStep;
    if(angle >= 2*PI)
      angle -= 2*PI;
  }
}
class Square {
  boolean right = true;
  boolean down = false;
  boolean left = false;
  boolean up = false;
  int transX = 0;
  int transY = 0;
  int offsetX = 0;
  int offsetY = 0;
  Square(int offsetX,int offsetY) {
    this.offsetX = offsetX;
    this.offsetY = offsetY;
  }
  void drawSquare() {
    pushMatrix();
    translate(transX,transY);
    for(int i = 100; i >= 1; i--) {
      shadeOfOrange(i);
      rect(offsetX,offsetY,i,i);
    }
    popMatrix();
    this.adjustTranslation();
  }
  void adjustTranslation() {
    if(right) {
      transX++;
      if(transX == 600) {
        right = false;
        down = true;
      }
    }
    else if(down) {
      transY++;
      if(transY == 600) {
        down = false;
        left = true;
      }
    }
    else if(left) {
      transX--;
      if(transX == 0) {
        left = false;
        up = true;
      }
    }
    else if(up) {
      transY--;
      if(transY == 0) {
        up = false;
        right = true;
     }
    }
  }
}
class Triangle {
  float triangleScalar = 1;
  boolean scalarUp = true;
  float triangleStep = 0.01;
  int offsetX = 0;
  int offsetY = 0;
  Triangle(int offsetX,int offsetY) {
    this.offsetX = offsetX;
    this.offsetY = offsetY;
  }
  void drawTriangle() {
    pushMatrix();
    for(int i = 100; i >= 1; i--) {
      shadeOfOrange(i);
      float vert1x = offsetX;
      float vert1y = offsetY - (sqrt(3)/3)*i*triangleScalar;
      float vert2x = offsetX - i/2 * triangleScalar;
      float vert2y = offsetY + (sqrt(3)/6)*i*triangleScalar;
      float vert3x = offsetX + i/2 * triangleScalar;
      float vert3y = offsetY + (sqrt(3)/6)*i*triangleScalar;
      triangle(vert1x,vert1y,vert2x,vert2y,vert3x,vert3y);
    }
    popMatrix();
    this.incrementScalar();
  }
  void incrementScalar() {
    if(triangleScalar > 2.0)
      scalarUp = false;
    else if(triangleScalar < 0.5)
      scalarUp = true;

    if(scalarUp)
      triangleScalar += triangleStep;
    else
      triangleScalar -= triangleStep;
  }
}

Answer 1

OpenProcessing使用Processing.js，它是JavaScript，你必须小心在JavaScript中命名。例如，您不能拥有与函数同名的变量。

具体来说，您的triangle变量与triangle()函数发生冲突。基本上，您正在使用triangle()变量替换triangle函数，因此当JavaScript尝试调用triangle()函数时，它会获取您的triangle变量，而您获得这个错误：

Uncaught TypeError: triangle is not a function

请注意，这在JavaScript控制台中显示。你应该养成检查错误的习惯。你可以在大多数浏览器中按F12键来实现它。

解决问题的简单方法是简单地重命名triangle变量（以及任何其他具有冲突名称的变量），以便它不再发生冲突。

可以找到更多信息here。

我在OOP中的处理草图不起作用

1 个答案: