objective-c - 没有 mask 层的 UIView 圆角

Question

我正在构建一个 iPad 应用程序，其中包含多个条形图(每个图 30 多个条形图)和屏幕底部的上拉菜单。该设计要求这些栏在左上角和右上角具有圆角，但在左下角和右下角具有方角。

现在，我通过使用 mask 层将每个单独的图形条的顶角圆化:

#import "UIView+RoundedCorners.h"
#import <QuartzCore/QuartzCore.h>

@implementation UIView (RoundedCorners)

-(void)setRoundedCorners:(UIRectCorner)corners radius:(CGFloat)radius {
    CGRect rect = self.bounds;

    // Create the path 
    UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:rect 
                                                   byRoundingCorners:corners
                                                         cornerRadii:CGSizeMake(radius, radius)];

    // Create the shape layer and set its path
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.frame = rect;
    maskLayer.path = maskPath.CGPath;

    // Set the newly created shape layer as the mask for the view's layer
    self.layer.mask = maskLayer;
    self.layer.shouldRasterize = YES;
}

@end

这行得通，但是当我拉起上拉菜单时出现严重的帧丢失/滞后(请注意，菜单重叠，出现在图表的顶部)。当我去掉圆角时，菜单拉起来很漂亮。据我所知，我需要一种通过直接修改 View 而不是使用 mask 层来圆角的方法。有谁知道我如何解决这个问题或有其他可能的解决方案？非常感谢任何帮助

Answer 1

From what I gather, I need a way to round the corners by directly modifying the view, not by using a mask layer. Does anyone know how I could pull this off or have another possible solution?

通常的方法是获取 View 的图层并设置 cornerRadius 属性:

myView.layer.cornerRadius = 10.0;

这样就不需要 mask 层或贝塞尔曲线路径。在您的方法的上下文中，它将是:

-(void)setRoundedCorners:(UIRectCorner)corners radius:(CGFloat)radius
{
    self.layer.cornerRadius = radius;
}

更新:抱歉——我错过了这部分:

The design calls for these bars to have rounded corners on the top left and top right corner, but square corners on the bottom left and bottom right

如果您只希望一些 圆角，则不能通过设置层的cornerRadius 属性来实现。您可以采取两种方法:

• 创建一个有两个圆角和两个正方形的贝塞尔曲线路径，然后填充它。不需要 mask 层来做到这一点。

• 使用可调整大小的图片。请参阅 UIImage 的 -resizableImageWithCapInsets: 和 -resizableImageWithCapInsets:resizingMode: 方法。甚至还有一些方法可以为可调整的图像制作动画，因此您可以轻松地让条形图增长到合适的长度。