Rendering Front to back

I was wondering if its possible to render things in front to back order without using P3D
to render in the example below render the orange wall and then the blue wall
image
but to have it only render on the screen where it hasnt been drawn on before instead of just rendering ontop of whats already there. its important the method doesnt use P3D and that it draws the shapes with Beginshape() and vertexes rather than rect();

thanks in advance

  • David S

Hello,

You would need to keep track of the shapes you are drawing.
When you want to add a new shape, you clear the screen, and redraw every shapes in the desired order.

For example:

ArrayList<Circle> circles = new ArrayList<Circle>();

void setup() {
  size(800, 600);
  colorMode(HSB, 360, 100, 100);
}

void draw() {
  background(20);
  for (int i = circles.size() - 1; i >= 0; i--) {
    circles.get(i).display();
  }
}

void mouseClicked() {
  circles.add(new Circle(mouseX, mouseY));
}

class Circle {
  PVector pos = new PVector();
  int hue;
  
  Circle(int x, int y) {
    hue = (int)random(360);
    pos.x = x;
    pos.y = y;
  }
  
  void display() {
    stroke(hue, 100, 100);
    strokeWeight(1);
    fill(hue, 30, 100);
    ellipse(pos.x, pos.y, 100, 100);
  }
}
2 Likes