背景：
下面的镜头是OS X Lion中的Mail.app.当源列表过长时,源列表底部的按钮上方出现一个很好的阴影线.当您滚动时,源列表将在该阴影线下移动.当您展开窗口时,源列表中的所有内容都适合不滚动,阴影线消失.
问题：
如何使用Cocoa绘制阴影线？我知道NSShadow等等,但在我看来,这里还有更多的只是一个阴影.有一条线微妙地消失到点上(就像您在Photoshop中的每一端应用了一个渐变蒙版).同样的,阴影是椭圆形的,随着接近线条的渐变.那么它不只是一个常规的NSShadow,是吗？ (这绝对不是一个图像,因为当扩展源视图的宽度时它会很好地扩展.)
任何关于如何绘制这种形状的技巧将不胜感激.
而对于那些粘贴者来说,不,这并不违反NDA,因为Mail.app已被苹果公开显示.
解决方法
大概的概念：
.
>创建一个尺寸为150px×10px的图层“Layer A”
并用渐变填充：
>较低的颜色：#535e71不透明度：33％
>上部颜色：#535e71不透明度：0％
>创建一个尺寸为150px×1px的图层“Layer B”
并填写固体#535e71不透明度：50％
>将“层A”和“层B”组合成“层C”.
>将反射的渐变掩码从#ffffff应用到#000000到“Layer C”.
视觉步骤：
MyView.h：
#import <Cocoa/Cocoa.h>
@interface MyView : NSView {
@private
}
@end
MyView.m：
#import "MyView.h"
@implementation MyView
- (CGImageRef)maskForRect:(NSRect)dirtyRect {
NSSize size = [self bounds].size;
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef context = CGBitmapContextCreate(NULL,size.width,size.height,8,colorSpace,kCGImageAlphaPremultipliedLast);
CGContextClipToRect(context,*(CGRect*)&dirtyRect);
CGRect rect = CGRectMake(0.0,0.0,size.height);
size_t num_locations = 3;
CGFloat locations[3] = { 0.0,0.5,1.0 };
CGFloat components[12] = {
1.0,1.0,// Start color
0.0,// Middle color
1.0,// End color
};
CGGradientRef myGradient = CGGradientCreateWithColorComponents(colorSpace,components,locations,num_locations);
CGPoint myStartPoint = CGPointMake(CGRectGetMinX(rect),CGRectGetMinY(rect));
CGPoint myEndPoint = CGPointMake(CGRectGetMaxX(rect),CGRectGetMinY(rect));
CGContextDrawLinearGradient(context,myGradient,myStartPoint,myEndPoint,0);
CGImageRef theImage = CGBitmapContextCreateImage(context);
CGImageRef theMask = CGImageMaskCreate(CGImageGetWidth(theImage),CGImageGetHeight(theImage),CGImageGetBitsPerComponent(theImage),CGImageGetBitsPerPixel(theImage),CGImageGetBytesPerRow(theImage),CGImageGetDataProvider(theImage),NULL,YES);
[(id)theMask autorelease];
CGColorSpaceRelease(colorSpace);
CGContextRelease(context);
return theMask;
}
- (void)drawRect:(NSRect)dirtyRect {
NSRect nsRect = [self bounds];
CGRect rect = *(CGRect*)&nsRect;
CGRect lineRect = CGRectMake(rect.origin.x,rect.origin.y,rect.size.width,(CGFloat)1.0);
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef context = (CGContextRef) [[NSGraphicsContext currentContext] graphicsPort];
CGContextClipToRect(context,*(CGRect*)&dirtyRect);
CGContextClipToMask(context,rect,[self maskForRect:dirtyRect]);
size_t num_locations = 2;
CGFloat locations[2] = { 0.0,1.0 };
CGFloat components[8] = {
0.315,0.371,0.450,0.3,// Bottom color
0.315,0.0 // Top color
};
CGGradientRef myGradient = CGGradientCreateWithColorComponents(colorSpace,CGRectGetMinY(rect));
CGPoint myEndPoint = CGPointMake(CGRectGetMinX(rect),CGRectGetMaxY(rect));
CGContextDrawLinearGradient(context,0);
CGContextSetRGBFillColor(context,0.315,0.5 );
CGContextFillRect(context,lineRect);
CGColorSpaceRelease(colorSpace);
}
@end
(我的第一次使用纯粹的低级CoreGraphics,因此可能是次级最优,开放改进.)
这是上面代码产生的实际截图：
绘图延伸到视图的尺寸.
(我以前有两种技术在这里显示：“技术A”和“技术B”.“技术B”提供了优异的效果,并且实现起来也更简单,所以我放弃了“技术A”.有些评论可能还是指“技术A”.只要忽略它们并享受功能完整的代码段.)
