NSTableView: Create "Overlapping" Rows

Question

The Goal

I have an NSTableView in my app and I'd like to draw "overlapping" rows to create a "connecting" effect like that in Automator.app:

---

What I'm Trying

The approach I'm considering is to use NSTableView's -(NSRect)frameOfCellAtColumn:(NSInteger)columnIndex row:(NSInteger)rowIndex method to increase the Y-origin of all rows after the first. My tableView is view-based and it does NOT use auto-layout.

My question is: is that the correct way to achieve this effect? It seems "dangerous" to have the tableView draw rows with overlapping frames and I can't figure out if this is going to result in a bunch of extra blank space at the bottom of the tableView (because the tableView doesn't take the overlapping frames into account when calculating its overall height; it just uses the sum of the rowHeight value from each row.)

Does anyone know if there's a different, canonical way to achieve the effect from the Automator tableView?

Answer 1

As Patrick Goley suggested, I think you should fake it by drawing the connection point as part of the background or a table view separator.

Apple's HoverTableDemo sample illustrates some of the techniques and the WWDC 2011 session 120 video "View Based NSTableView Basic to Advanced" describes them in more detail.

I think you would set the table view's intercellSpacing to accommodate the connection point image size. You would set the gridStyleMask to include NSTableViewSolidHorizontalGridLineMask.

You would use a custom subclass of NSTableRowView to do the custom drawing of the background and separators (between the rows). You'd override -drawBackgroundInRect: and -drawSeparatorInRect: for those.

You would use a custom sublcass of NSTableView to do custom drawing of the grid beyond the end of the rows, which might just be the arrow off the bottom of the last row, if you want one. You would override -drawGridInClipRect: to do that.