如何让 NSScrollView 尊重剪切路径

发布于 2024-10-21 02:50:33 字数 718 浏览 2 评论 0原文

我正在尝试制作一个带有剪角的 NSScrollView，类似于 Twitter 应用程序：

在此处输入图像描述

我有一个 NSScrollView 子类，我添加了以下代码：

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

    [super drawRect:dirtyRect];
}

我期望 NSScrollView 的内容具有圆角，但它不尊重剪切路径。我该怎么做？

更新&澄清
我知道如何制作自定义 NSScroller，我知道如何使其透明覆盖。我所问的只是如何使 NSSCrollView 剪掉它的角，包括它包含的所有内容。 NSScrollView 位于 NSView 内，其背景可能会发生变化，这意味着无法选择覆盖视图来伪造圆角。

原文

I am trying to make a NSScrollView with clipped corners, similar to the Twitter app:

enter image description here

I have a NSScrollView subclass which I added the following code:

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

    [super drawRect:dirtyRect];
}

I expected the content of the NSScrollView to have rounded corners, but it is not respecting the clipped path. How can I do this?

UPDATE & CLARIFICATION
I know how to make a custom NSScroller, I know how to make it transparent overlay. All I am asking is how to make the NSSCrollView clip its corners, including everything it contains. The NSScrollView is inside a NSView which has a background that could change, meaning a view overlay to fake the rounded corners is not an option.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

旧街凉风 2024-10-28 02:50:33

经过一番摆弄，我刚刚发现 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];

After much fiddling, I just discovered that NSScrollView's can be made to have rounded corners by simply giving it a backing layer and setting that layer's corner radius provided you also do the same to it's internal NSClipView. Both are required, which now makes sense, since it's the clip view that actually provides the viewable window into the NSScrollView's document view.

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 原文

兮颜 2024-10-28 02:50:33

您可以将遮罩应用于视图的图层：

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

遮罩是另一个CALayer。因此，在这种情况下，您需要创建一个 CALayer，将其背景颜色设置为不透明，设置其边界以匹配滚动视图，并为其指定一个 cornerRadius，例如 <代码>8.0。

结果是滚动视图及其所有内容看起来都被遮盖为圆角半径为 8px 的圆角矩形。

You can apply a mask to a view's layer:

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

The mask is another CALayer. So in this case you'd create a CALayer, set its background colour to opaque, set its bounds to match the scrollview, and give it a cornerRadius of, say, 8.0.

The result would be that the scroll view and all its contents would appear to be masked to a roundrect with a corner radius of 8px.

回复收藏 0 原文

只为一人 2024-10-28 02:50:33

您是否尝试过覆盖

- (BOOL)isOpaque {
  return NO;
}

并将滚动视图的 -setDrawsBackground: 设置为 NO 并仅保留视图而不进行剪切，只需使用 [NSColor clearColor] 绘制角点 code> 因为这也会清除底层颜色并模拟圆形效果。

Have you tried overriding

- (BOOL)isOpaque {
  return NO;
}

And setting the scroll view's -setDrawsBackground: to NO and just leave the view without clipping and just draw the corners with [NSColor clearColor] since this will also clear the underlying color and simulate a round effect.

回复收藏 0 原文

~没有更多了~