Code

size(400,100);
background(255,200,200);

beginShape();
vertex(10,10); 
for (int i=0; i<19; i++){
  float x0 = 10 + i*20; 
  float x1 = x0 + 10;
  vertex(x0,30);
  vertex(x1,50);
}
vertex(390,30);
vertex(390,10); 
endShape(CLOSE);

0407 - beginShape(): A new way of drawing

Statement:You are asked to use the beginShape(), vertex(), and endShape() commands to reproduce the serrated shape shown here :



You will note that this shape has many "teeth". To render this shape properly, you will need to combine a small number of hand-coded vertices, with a large number of vertices which are computationally generated. Here are some hints:

  • The canvas is 400x100.
  • The only hand-coded vertices are located at (10,10), (390,10), and (390, 30). These are used for the top corners of the shape, more-or-less.
  • All of the other vertices are generated by a for{} loop. The symmetrical teeth are 20 pixels apart, and 20 pixels high.
  • All of the vertices are contained within a single set of beginShape() and endShape() commands.

hide statement