NSScrollView with sticky top, left and bottom 'headers'

2
votes

I'm trying to create a timeline control in Cocoa. This is what I am trying to achieve. It's basically a standard timeline design.

However, I don't know which approach to take. The problem lies with the top ruler, the left track list and the bottom audio waveform display. These three parts need to always be visible and 'stick' to the edges. The ruler and audio waveform should only scroll horizontally, while the track list on the left should only scroll vertically.

For the top ruler, NSRulerView seems appropriate since it's just a ruler.

For the left view and the bottom view I don't know which route to take. I've played with using a wide vertical NSRulerView for the track list. This works but creates additional problems. For example: the top ruler appears above the track list.

I've composed four options so far:

  1. Forget NSRulerView and draw everything custom in the document view. This seems feasible but sidesteps built in NSRulerView functions. Also, I need to find a way to shorten the scrollbars so they don't overlap the side and top views.

  2. Use NSRulerViews for the top and left side. The bottom side will then probably be drawn manually in the document view.

  3. Place the left view outside the scrollview and manually scroll it up and down by linking it to the main scroll view. Use NSRulerView for the top, manually draw audio waveform in document view.

  4. An NSScrollView embedded in another NSScrollView. The outer handles horizontal scrolling, the inner scroll view handles vertical scrolling. Possible I think, but it seems hacky.

So my question boils down to: Which route to take?. Can anyone shed some light on this issue and point me in the right direction?

1
cocoansviewdrawrectnsscrollview

1 Answers

4
votes

What I understand:

  • You want a view to the left of an NSScrollView which scrolls vertically with the NSScrollView while ignoring horizontal scrolling.

  • You want a view below an NSScrollView which scrolls horizontally with the NSScrollView while ignoring vertical scrolling.

  • You want rulers.

To achieve this task:

  • Use 3 separate scroll views which do not overlap and donot inherit one another.

  • Activate rulers in whichever view(s) you would like them to appear.

  • Synchronize the scroll views (so that when one scrolls, the other scrolls accordingly).

How to synchronize scroll views is in the help. See User Experience > Controls > Scroll View Programming Guide for Mac > Synchronizing Scroll Views. This is also indirectly linked in the header of the help guide for NSScrollView.

If you want the three scroll views to be contained within an NSSplitView for resizing simplicity, then a fourth view must be added to consume the unused corner (good place to put controls). Since an NSSplitView can only be split vertically or horizontally, you will have to create an NSSplitView containing 2 split views with each of those split views containing 2 views that you actually see (splitting in one direction and then the other). The resizing of the split views will have to be synchronized in a manner much like the scrolling is synchronized to retain a straight cross of all four views.