没有遮罩层的UIView圆角

时间:2012-11-05 20:59:18

标签: objective-c ios uiview core-animation core-graphics

我正在构建一个iPad应用程序,其中包括几个条形图(每个图形超过30个条形图)和一个从屏幕底部开始的上拉菜单。设计要求这些条形在左上角和右上角有圆角,但左下角和右下角有方角。

现在,我使用遮罩层对每个单独图形条的顶角进行四舍五入:

#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

这样可行,但是当我拉起上拉菜单时会出现严重的帧丢失/延迟(请注意,菜单重叠,出现在图表的顶部)。当我拿走圆角时,菜单拉得很漂亮。从我收集的内容来看,我需要一种方法来通过直接修改视图来圆角,而不是使用遮罩层。有谁知道如何解决这个问题或者有其他可能的解决方案?任何帮助非常感谢

2 个答案:

答案 0 :(得分:4)

  

从我收集的内容来看,我需要一种直接绕过角落的方法   修改视图,而不是使用遮罩层。有谁知道我   可以解决这个问题还是有其他可能的解决办法?

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

myView.layer.cornerRadius = 10.0;

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

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

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

  

设计要求这些条形顶部有圆角   左上角和右上角,但左下角有方角   右下角

如果您只希望某些角落四舍五入,则无法通过设置图层的cornerRadius属性来实现。您可以采取两种方法:

  • 创建一个贝塞尔路径,其中两个圆角为圆角,两个方形,然后填充它。不需要遮罩层来做到这一点。

  • 使用可调整大小的图片。请参阅UIImage的-resizableImageWithCapInsets:-resizableImageWithCapInsets:resizingMode:方法。甚至还有一些方法可以为可重新调整的图像设置动画,因此您可以轻松地将条形图扩展到合适的长度。

答案 1 :(得分:1)

尝试在图层上设置shouldRasterize。应该有所帮助。