Question

I’m searching for a way to implement something like reusable cells for UI/NSTableView but for NSScrollView. Basically I want the same like the WWDC 2011 video “Session 104 – Advanced Scroll View Techniques” but for Mac.

I have several problems realizing this. The first: NSScrollView doesn’t have -layoutSubviews. I tried to use -adjustScroll instead but fail in setting a different contentOffset:

- (NSRect)adjustScroll:(NSRect)proposedVisibleRect {
    if (proposedVisibleRect.origin.x > 600) {
        //  non of them work properly
        // proposedVisibleRect.origin.x = 0;
        // [self setBoundsOrigin:NSZeroPoint];
        // [self setFrameOrigin:NSZeroPoint];
        // [[parentScrollView contentView] scrollPoint:NSZeroPoint];
        // [[parentScrollView contentView] setBoundsOrigin:NSZeroPoint];
    }
    return proposedVisibleRect;
}

The next thing I tried was to set a really huge content view with a width of millions of pixel (which actually works in comparison to iOS!) but now the question is, how to install a reuse-pool?
Is it better to move the subviews while scrolling to a new position or to remove all subviews and insert them again? and how and where should I do that?

Answer 1

As best I can tell, -adjustScroll: is not where you want to tap into the scrolling events because it doesn’t get called universally. I think -reflectScrolledClipView: is probably a better hookup point.

I cooked up the following example that should hit the high points of one way to do a view-reusing scroll view. For simplicity, I set the dimensions of the scrollView’s documentView to “huge”, as you suggest, rather than trying to “fake up” the scrolling behavior to look infinite. Obviously drawing the constituent tile views for real is up to you. (In this example I created a dummy view that just fills itself with red with a blue outline to convince myself that everything was working.) It came out like this:

// For the header file
@interface SOReuseScrollView : NSScrollView
@end

// For the implementation file
@interface SOReuseScrollView () // Private

- (void)p_updateTiles;
@property (nonatomic, readonly, retain) NSMutableArray* p_reusableViews;

@end

// Just a small diagnosting view to convince myself that this works.
@interface SODiagnosticView : NSView
@end

@implementation SOReuseScrollView

@synthesize p_reusableViews = mReusableViews;

- (void)dealloc
{
    [mReusableViews release];
    [super dealloc];
}

- (NSMutableArray*)p_reusableViews
{
    if (nil == mReusableViews)
    {
        mReusableViews = [[NSMutableArray alloc] init];
    }
    return mReusableViews;
}

- (void)reflectScrolledClipView:(NSClipView *)cView
{
    [super reflectScrolledClipView: cView];
    [self p_updateTiles];
}

- (void)p_updateTiles
{
    // The size of a tile...
    static const NSSize gGranuleSize = {250.0, 250.0};

    NSMutableArray* reusableViews = self.p_reusableViews;
    NSRect documentVisibleRect = self.documentVisibleRect;

    // Determine the needed tiles for coverage
    const CGFloat xMin = floor(NSMinX(documentVisibleRect) / gGranuleSize.width) * gGranuleSize.width;
    const CGFloat xMax = xMin + (ceil((NSMaxX(documentVisibleRect) - xMin) / gGranuleSize.width) * gGranuleSize.width);
    const CGFloat yMin = floor(NSMinY(documentVisibleRect) / gGranuleSize.height) * gGranuleSize.height;
    const CGFloat yMax = ceil((NSMaxY(documentVisibleRect) - yMin) / gGranuleSize.height) * gGranuleSize.height;

    // Figure out the tile frames we would need to get full coverage
    NSMutableSet* neededTileFrames = [NSMutableSet set];
    for (CGFloat x = xMin; x < xMax; x += gGranuleSize.width)
    {
        for (CGFloat y = yMin; y < yMax; y += gGranuleSize.height)
        {
            NSRect rect = NSMakeRect(x, y, gGranuleSize.width, gGranuleSize.height);
            [neededTileFrames addObject: [NSValue valueWithRect: rect]];
        }
    }

    // See if we already have subviews that cover these needed frames.
    for (NSView* subview in [[[self.documentView subviews] copy] autorelease])
    {
        NSValue* frameRectVal = [NSValue valueWithRect: subview.frame];

        // If we don't need this one any more...
        if (![neededTileFrames containsObject: frameRectVal])
        {
            // Then recycle it...
            [reusableViews addObject: subview];
            [subview removeFromSuperview];
        }
        else
        {
            // Take this frame rect off the To-do list.
            [neededTileFrames removeObject: frameRectVal];
        }
    }

    // Add needed tiles from the to-do list
    for (NSValue* neededFrame in neededTileFrames)
    {
        NSView* view = [[[reusableViews lastObject] retain] autorelease];
        [reusableViews removeLastObject];

        if (nil == view)
        {
            // Create one if we didnt find a reusable one.
            view = [[[SODiagnosticView alloc] initWithFrame: NSZeroRect] autorelease];
            NSLog(@"Created a view.");
        }
        else 
        {
            NSLog(@"Reused a view.");
        }

        // Place it and install it.
        view.frame = [neededFrame rectValue];
        [view setNeedsDisplay: YES];        
        [self.documentView addSubview: view];
    }
}

@end

@implementation SODiagnosticView

- (void)drawRect:(NSRect)dirtyRect
{
    // Draw a red tile with a blue border.
    [[NSColor blueColor] set];
    NSRectFill(self.bounds);

    [[NSColor redColor] setFill];
    NSRectFill(NSInsetRect(self.bounds, 2,2));    
}

@end

This worked pretty well as best I could tell. Again, drawing something meaningful in the reused views is where the real work is here.

Hope that helps.