Question

Specifically in wxHaskell, but in general, would like to be able to draw lines between items in two lists that are side by side to show that there is a relationship between the items. Something like the mockup below.

Answer 1

Perhaps there is something about your setup that I do not understand, but this seems perfectly straightforward.

Suppose you want to draw a line between input one and output three.

• You need four co-ordinates in the co-ordinate system of the window that is the parent of the two lists. Lets call them xi, yi, xo, yo

• The xi and xo are constants

• The yi and yo depend only on the height of one row in your lists and the index number of the items.

• Now create a wxClientDC from the parent window

• And draw your line in the DC.

  parentWindowDC.DrawLine(xi,yi,xo,yo);

I notice that you have shown the arrows on TOP of the list windows. The above will draw them behind. To draw them in the top, you will have to do a little bit of computational geometry, then you can calculate the points where the line (xi,yi,xo,yo) intersects the edges of the two list boxes. Then you draw three lines, using the same brush,

• between xi,yi and the intersection with the input box edge in the input window DC
• between the two intersections in the parent window DC
• between the output box edge and xo,yo in the output box DC