Question

I found this great subclass of NSWindow, however it does not add any noise to the gradient of the toolbar. If you look closely at The App Store, Reeder or Twitter they all have noise over the gradient.

How do I add noise to a gradient?

I found this thread but I don’t understand how to put this into code.

Answer 1

First of all the nessesary code has been added to INAppStoreWindow, so i have no use case for this anymore. However for people who would like to know how to do this, heres how it’s done by INAppStoreWindow.

First a function for making the image with noise is created.

static CGImageRef createNoiseImageRef(NSUInteger width, NSUInteger height, CGFloat factor)
{
    NSUInteger size = width*height;
    char *rgba = (char *)malloc(size); srand(124);
    for(NSUInteger i=0; i < size; ++i){rgba[i] = rand()%256*factor;}
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceGray();
    CGContextRef bitmapContext = 
    CGBitmapContextCreate(rgba, width, height, 8, width, colorSpace, kCGImageAlphaNone);
    CFRelease(colorSpace);
    free(rgba);
    CGImageRef image = CGBitmapContextCreateImage(bitmapContext);
    CFRelease(bitmapContext);
    return image;
}

Then the image is used to overlay the noise over the current graphics

    static CGImageRef noisePattern = nil;
    if (noisePattern == nil) noisePattern = createNoiseImageRef(128, 128, 0.015);
    [NSGraphicsContext saveGraphicsState];
    [[NSGraphicsContext currentContext] setCompositingOperation:NSCompositePlusLighter];
    CGRect noisePatternRect = CGRectZero;
    noisePatternRect.size = CGSizeMake(CGImageGetWidth(noisePattern), CGImageGetHeight(noisePattern));        
    CGContextRef context = [[NSGraphicsContext currentContext] graphicsPort];
    CGContextDrawTiledImage(context, noisePatternRect, noisePattern);
    [NSGraphicsContext restoreGraphicsState];