美文网首页iOS项目实践中的学习小知识点杂乱
iOS 设置圆角、指定位置圆角及 iOS 11圆角设置

iOS 设置圆角、指定位置圆角及 iOS 11圆角设置

作者: tt大眼仔 | 来源:发表于2018-08-23 15:18 被阅读1655次

    1. 使用UIView.layer.cornerRadius 进行圆角设置

    view.layer.cornerRadius = 20;
    view.layer. masksToBounds = YES; // 部分UIView需要设置这个属性
    

    此处view.layer. masksToBounds = YES; 会触发离屏渲染,如果在UITableViewCell和UICollectionViewCell中使用,严重的会掉帧、不流畅

    2.使用贝塞尔曲线画圆角及指定位置圆角

    CGFloat radius = 20; // 圆角大小
    UIRectCorner corner = UIRectCornerAllCorners; // 圆角位置,全部位置
    UIBezierPath * path = [UIBezierPath bezierPathWithRoundedRect:view.bounds byRoundingCorners:corner cornerRadii:CGSizeMake(radius, radius)];
    CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
    maskLayer.frame = view.bounds;
    maskLayer.path = path.CGPath;
    view.layer.mask = maskLayer;
    

    UIRectCorner 的定义如下

    typedef NS_OPTIONS(NSUInteger, UIRectCorner) {
        UIRectCornerTopLeft     = 1 << 0, // 左上
        UIRectCornerTopRight    = 1 << 1, // 右上
        UIRectCornerBottomLeft  = 1 << 2, // 左下
        UIRectCornerBottomRight = 1 << 3, // 右下
        UIRectCornerAllCorners  = ~0UL // 全部位置
    };
    

    UIRectCorner 可以使用位运算进行圆角设置,如:

    UIRectCorner corner = UIRectCornerTopRight | UIRectCornerBottomRight; // 右上和右下进行圆角
    

    圆角加边框

    CGFloat radius = 20; // 圆角大小
    UIRectCorner corner = UIRectCornerAllCorners; // 圆角位置,全部位置
    UIBezierPath * path = [UIBezierPath bezierPathWithRoundedRect:view.bounds byRoundingCorners:corner cornerRadii:CGSizeMake(radius, radius)];
    CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
    maskLayer.frame = view.bounds;
    maskLayer.path = path.CGPath;
    
    // 带边框则两个颜色不要设置成一样即可
    maskLayer.strokeColor = [UIColor redColor].CGColor;
    maskLayer.fillColor = [UIColor yellowColor].CGColor;
    [view.layer addSublayer:maskLayer];
    

    3.iOS11 新特性——改善view圆角

    if (@available(iOS 11.0, *)) {
            view.layer.cornerRadius = radius;
            view.layer.maskedCorners = kCALayerMinXMinYCorner; // 左上圆角
    }
    

    CACornerMask的定义如下:

    typedef NS_OPTIONS (NSUInteger, CACornerMask)
    {
      kCALayerMinXMinYCorner = 1U << 0, // 左上
      kCALayerMaxXMinYCorner = 1U << 1, 右上
      kCALayerMinXMaxYCorner = 1U << 2, // 左下
      kCALayerMaxXMaxYCorner = 1U << 3, // 右下
    };
    CACornerMask 如同上面的UIRectCorner 可以使用位运算进行圆角设置
    

    4.对UIView进行自定义圆角分类

    @interface UIView (ACSLayer)
    /**
     圆角
     使用自动布局,需要在layoutsubviews 中使用
     @param radius 圆角尺寸
     @param corner 圆角位置
     */
    - (void)acs_radiusWithRadius:(CGFloat)radius corner:(UIRectCorner)corner {
        if (@available(iOS 11.0, *)) {
            self.layer.cornerRadius = radius;
            self.layer.maskedCorners = (CACornerMask)corner;
        } else {
            UIBezierPath * path = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:corner cornerRadii:CGSizeMake(radius, radius)];
            CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
            maskLayer.frame = self.bounds;
            maskLayer.path = path.CGPath;
            self.layer.mask = maskLayer;
        }
    }
    @end
    

    此方法在iOS 11 中使用iOS 11中的maskedCorners进行圆角设置,如是iOS 11 一下则使用贝塞尔曲线画圆角。

    相关文章

      网友评论

        本文标题:iOS 设置圆角、指定位置圆角及 iOS 11圆角设置

        本文链接:https://www.haomeiwen.com/subject/kitmiftx.html