Fade effect at the top and bottom of the NSTableView / NSOutlineView

I am looking for a way to draw a fade effect on a table view (and outline, but I think it will be the same) when the content scrolls. Here is an example from Fantastical :

fade effect on top

Also a video with similar shading on QuickLook windows is here .


To do this, I tried to subclass the scrollview of the view table with this code:

#define kFadeEffectHeight 15

@implementation FadingScrollView

- (void)drawRect: (NSRect)dirtyRect
{
    [super drawRect: dirtyRect];

    NSGradient* g = [[NSGradient alloc] initWithStartingColor: [NSColor blackColor] endingColor: [NSColor clearColor]];

    NSRect topRect = self.bounds;
    topRect.origin.y = self.bounds.size.height - kFadeEffectHeight;
    topRect.size.height = kFadeEffectHeight;

    NSRect botRect = self.bounds;
    botRect.size.height = kFadeEffectHeight;

    [NSGraphicsContext saveGraphicsState];
    [[NSGraphicsContext currentContext] setCompositingOperation: NSCompositeDestinationAtop];
    // Tried every compositing operation and none worked. Please specify wich one I should use if you do it this way

    [g drawInRect: topRect angle: 90];
    [g drawInRect: botRect angle: 270];

    [NSGraphicsContext restoreGraphicsState];
}

... but this has not disappeared, probably because it is called before the actual view of the table is displayed. I do not know how to do that: (

By the way, both the tableview and outlineview that I want to use are based on the view, and the application is only 10.7.

+5
1

Mac OS X ( ), , . .

( ) , , , , : NSScrollView, " ", , JLNFadingScrollView / Github. , .: -)

Examples of JLNFadingScrollView

+7

All Articles