2011-03-11 186 views
2

我试图做一个NSScrollView用剪切的边角,类似于Twitter的应用程序剪辑路径:我怎样才能得到NSScrollView尊重

enter image description here

我有一个NSScrollView子类,添加以下代码:

- (void)drawRect:(NSRect)dirtyRect { 
    NSBezierPath *pcath = [NSBezierPath bezierPathWithRoundedRect:[self bounds] xRadius:kDefaultCornerRadius yRadius:kDefaultCornerRadius]; 
    [path setClip]; 

    [super drawRect:dirtyRect]; 
} 

我预计NSScrollView的内容有圆角,但它不尊重剪辑路径。我怎样才能做到这一点?




UPDATE &澄清
我知道如何使一个自定义NSScroller,我知道如何使它透明覆盖。我所要求的只是如何使NSSCrollView卡在其角落,包括它所包含的一切。 NSScrollView位于NSView之内,其背景可能会发生变化,这意味着视图叠加以伪造圆角不是选项。

+0

drawRect声明的超级实现可能会设置新闻剪辑。尝试逐个绘制部件,而不是调用超级部件,看看它是否会改变任何内容。 – sosborn 2011-03-11 03:10:45

+0

你的意思是画出contentView和documentView自己,而不是要求super做到这一点?看起来我不得不重新实现所有的NSScrollView滚动逻辑来做到这一点。我希望有一种方式,而不是重新发明轮子。 – coneybeare 2011-03-11 03:16:52

+0

查看NSScroller的文档。通常一个NSScrollView将有两个NSScrollers,一个x和一个y。 NSScroller类公开了绘制方法。如果你要像Twitter客户端一样的外观,你将不得不继承NSScroller的子类。 – sosborn 2011-03-11 05:32:17

回答

4

您可以将面膜视图的层:

[myScrollView setWantsLayer: YES]; 
[myScrollView layer].mask = ...; 

掩码是另一个CALayer。因此,在这种情况下,您应创建一个CALayer,将其背景颜色设置为不透明,将其边界设置为与滚动视图匹配,并为其指定一个cornerRadius,例如8.0

结果将是滚动视图及其所有内容似乎被蒙上了一个圆角,圆角半径为8px。

+0

这似乎工作,但我需要在角落更多的灵活性。我只需要两个圆角,上面的舍入代码就是一个例子。不仅如此,但是当我在scrollview上执行此操作时,所有内部内容都停止绘制,并且我不确定如何在不使用drawRect的情况下重新创建它。 – coneybeare 2011-03-14 20:33:23

+0

您可以将遮罩层的内容属性设置为几乎任何内容。看一看Core Animation Cookbook,它会帮助你使用Core Animation绘图。 (不幸的是,网址不方便。) – 2011-03-14 22:31:05

+0

这个方法很有效,但会带来很多额外的问题(nsview在滚动视图中闪烁,在修剪过的角落显示奇怪的构件以及实时调整图层大小的问题)。我希望有另一个答案,因为这样做所需的努力似乎相当大。以下是我在此实现中看到的问题的简要屏幕录像:http://screencast.com/t/wKt5vCjoWPu – coneybeare 2011-03-16 04:32:32

3

您是否尝试过重写

- (BOOL)isOpaque { 
    return NO; 
} 

,并设置滚动视图-setDrawsBackground:NO和刚刚离开的看法,而不削波和只画边角与[NSColor clearColor],因为这也将清除底层的颜色和模拟轮效应。

+0

刚刚阅读您的更新要求“可能会改变的背景”,所以我想我的答案已经过时。 – 2011-03-18 13:19:48

6

多摆弄之后,我才发现,通过简单地给它一个背衬层和设置提供了层的拐角半径NSScrollView的,可向有圆角你也做同样的它的内部NSClipView。两者都是必需的,现在有意义,因为它实际上是在NSScrollView的文档视图中提供可视窗口的剪辑视图。

NSScrollView * scrollView = ...; 

// Give the NSScrollView a backing layer and set it's corner radius. 
[scrollView setWantsLayer:YES]; 
[scrollView.layer setCornerRadius:10.0f]; 

// Give the NSScrollView's internal clip view a backing layer and set it's corner radius. 
[scrollView.contentView setWantsLayer:YES]; 
[scrollView.contentView.layer setCornerRadius:10.0f]; 
+0

但请注意,这似乎不适用于包含NSTextView的NSScrollView。在这种情况下,我们需要恢复到屏蔽层方法。 – Dalmazio 2012-04-03 10:11:47