Drawing polygons with loops¶

Recall an example of a program that draws a fence:

As we learned in the meanwhile, drawing each picket with a separate statement is not the best way to draw this drawing. A more flexible program would be obtained by drawing the pickets in a loop. Let’s look at how we should draw a polygon (a picket is represented by a hexagon), so that it would be easy to draw the same polygon in other places.

It is certainly useful to introduce a main point (anchor), in relation to which all the polygonal vertices would be expressed. In the case of a fence, the vertices of the first picket are [(20, 80), (30, 70), (40, 80), (40, 270), (20, 270)]. We can select the first specified point (20, 80) for the anchor, and express the other points using the coordinates of the first point. So we get that the vertices of one picket are [(x, y), (x + 10, y-10), (x + 20, y), (x + 20, y + 190), (x, y + 190)] . By setting x = 20, y = 80, we get the coordinates of the first picket in the fence, and by increasing x successively by 40 each, we can get other pickets.

y = 80
for x in range(20, 300, 40):
    pg.draw.polygon(canvas, pg.Color('brown'), [(x, y), (x + 10, y-10), (x + 20, y), (x + 20, y+190), (x, y+190)])

Since all the pickets are at the same height, the y coordinate of the anchor does not change, so we don’t even have to introduce it (we would need to introduce the y coordinates if some of the pickets were above others). This means that in this case, we can write the previous code a little more simply.

for x in range(20, 300, 40):
    pg.draw.polygon(canvas, pg.Color('brown'), [(x, 80), (x + 10, 70), (x + 20, 80), (x + 20, 270), (x, 270)])

Various variants of this basic idea are possible. For example, if we initially form a list of polygonal vertices (for the first picket), we can form a list of displaced vertices in several ways.

We can calculate the coordinates of the displaced vertices in an additional loop:

picket = [(0, 0), (10, -10), (20, 0), (20, 190), (0, 190)]
y0 = 80
for x0 in range(20, 300, 40):
    displaced_picket = []
    for x, y in picket:
        displaced_picket.append((x+x0, y+y0))
    pg.draw.polygon(canvas, color, displaced_picket)

We can introduce a function to draw a given polygon at a given position, and form the list of displaced vertices in the function:

def draw_polygon(points, color, x0, y0):
    displaced_points = []
    for x, y in points:
        displaced_points.append((x+x0, y+y0))
    pg.draw.polygon(canvas, color, displaced_points)

picket = [(0, 0), (10, -10), (20, 0), (20, 190), (0, 190)]
for x0 in range(20, 300, 40):
    draw_polygon(picket, pg.Color('brown'), x0, 80)

Each of these two approaches can replace the seven calls to the pg.draw.polygon function in the given initial example, and each is better than drawing attachments with separate commands. Using the function gives slightly longer code, but it has the advantage that the exact same function can be used without any modification to draw any polygon in a new position.

Try one, or both of the suggested changes to the program above, and then use one of these methods to solve the following tasks.