Title: Draw multi-colored dashed lines with tkinter and Python

[Multi-colored dashed lines drawn with tkinter and Python]

Sometimes it's hard to draw lines that are visible on a particular image. If the image contains many colors, no single color can make a line very visible. For example, the picture on the right contains a red and yellow checkerboard so neither red lines nor yellow lines will be visible when you draw on it. In this example, you could pick some other color like blue or black, but what if you don't know what image you'll be using? Or what if the image contains a rainbow of colors so not one color is a good choice.

An easy solution is to draw multi-colored dashed lines. If you use two colors that very different (i.e. don't pick pink and light pink), then when one of them isn't visible over the background image, the other color should be visible.

This example lets you draw red and yellow dashed lines while you are selecting a new polygon. (See Let the user draw polygons in tkinter and Python.)

Drawing Checkerboards

This isn't the main purpose of this post, but drawing checkerboards can occasionally be useful. Here's how this example draws its checkerboard.

# Draw a checkerboard. size = 50 num_cols = canvas_wid // size + 1 num_rows = canvas_hgt // size + 1 for row in range(num_rows): y = row * size for col in range(num_cols): fill = 'red' if (row + col) % 2 == 0 else 'yellow' x = col * size self.canvas.create_rectangle(x, y, x + size, y + size, fill=fill, outline='black')

This code, which runs in the main app class's constructor, creates the program's Canvas widget. The only trick here is that it sets highlightthickness = 0 so things drawn on the canvas start in the upper left corner without leaving room for the highlight rectangle.

The code then sets the size of the checkerboard's squares and uses that to calculate the number of rows and columns the program needs to draw to fill the canvas. The + 1 at the end makes the program draw an extra row and column in case the canvas's size isn't exactly a multiple of the square size.

The code then loops through the rows and columns. If the row number plus the column number is even, the program makes that square red. If the sum is odd, it makes the square yellow. That statement is the one that gives the squares alternating colors.

The code calculates the coordinates of the square's upper left corner and draws the square.

Drawing Dashed Lines

Drawing multi-colored dashed lines is pretty easy. Simply draw a solid line in one color and then draw over it again with a dashed line that uses the other color. Here's the part of the example program that draws the initial selection polyline.

# Create the selection polylines. width = 3 self.new_polyline1 = self.canvas.create_line( self.new_points, fill='yellow', width=width) self.new_polyline2 = self.canvas.create_line( self.new_points, fill='red', width=width, dash=(4,4))

This code creates a solid yellow line and then draws a dashed red line on top.

Note: The values you can use for the dash parameter are different for different operating systems. If your system can't produce the pattern that you specify, it uses one that it thinks is close.

Here's the code that updates the two polylines when the program adds a new point to its new_points list.

# Update the selection polylines. self.canvas.coords(self.new_polyline1, self.new_points) self.canvas.coords(self.new_polyline2, self.new_points)

Conclusion

Drawing multi-colored dashed lines is easy—just draw a solid line in one color and then draw over it again with a dashed line that uses the other color. That technique lets you draw a line that's easy to see on any background. If the background is particularly cluttered, you may want to make the lines a bit thicker.

Download the example to experiment with it and to see additional details.