简体   繁体   中英

how to set cornerRadius for only bottom-left,bottom-right and top-left corner of a UIView?

Is there a way to set cornerRadius for only bottom-left,bottom-right and top-left corner of a UIView?

I tried the following, but it ended up making the view disappear. Is there anything wrong with the code below?

    UIBezierPath *maskPath;
    maskPath = [UIBezierPath bezierPathWithRoundedRect:view.bounds byRoundingCorners:(UIRectCornerBottomLeft | UIRectCornerBottomRight) cornerRadii:CGSizeMake(20.0, 20.0)];
    CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
    maskLayer.path = maskPath.CGPath;
    view.layer.mask = maskLayer;

You can do it like this:

UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.viewOutlet.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerBottomLeft | UIRectCornerBottomRight) cornerRadii:CGSizeMake(10.0, 10.0)];

CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.view.bounds;
maskLayer.path  = maskPath.CGPath;
self.viewOutlet.layer.mask = maskLayer;

在此处输入图片说明

Update:
If You need border just create another CAShapeLayer and add it to view's layer as sublayer. Like this (place this code below upper code):

CAShapeLayer *borderLayer = [[CAShapeLayer alloc] init];
borderLayer.frame = self.view.bounds;
borderLayer.path  = maskPath.CGPath;
borderLayer.lineWidth   = 4.0f;
borderLayer.strokeColor = [UIColor blackColor].CGColor;
borderLayer.fillColor   = [UIColor clearColor].CGColor;

[self.viewOutlet.layer addSublayer:borderLayer];

在此处输入图片说明

In swift 3.0 like this:

let maskPath = UIBezierPath.init(roundedRect: self.viewOutlet.bounds, byRoundingCorners:[.topLeft, .bottomLeft], cornerRadii: CGSize.init(width: 10.0, height: 10.0))
let maskLayer = CAShapeLayer()
maskLayer.frame = self.viewOutlet.bounds
maskLayer.path = maskPath.cgPath
self.viewOutlet.layer.mask = maskLayer

Tested in xcode 8 and swift 3

extension UIView {
    func roundCorners(corners:UIRectCorner, radius: CGFloat) {
      let path = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
      let mask = CAShapeLayer()
      mask.path = path.cgPath
      self.layer.mask = mask
    }
}

And use like this

YourView.roundCorners([.topLeft, .bottomLeft], radius: 10)

Use a custom UIView and Implement the below code

#import "CustomUIView.h"

@implementation CustomView

- (void)drawRect:(CGRect)rect
{
    // Drawing code
    CAShapeLayer * maskLayer = [CAShapeLayer layer];
    maskLayer.path = [UIBezierPath bezierPathWithRoundedRect: self.bounds byRoundingCorners: UIRectCornerTopLeft | UIRectCornerBottomLeft | UIRectCornerBottomRight cornerRadii: (CGSize){20.0, 20.0}].CGPath;

    self.layer.mask = maskLayer;
}

@end

Output:

在此处输入图片说明

Look at the UIBezierPath.h options :

typedef NS_OPTIONS(NSUInteger, UIRectCorner) {
    UIRectCornerTopLeft     = 1 << 0,
    UIRectCornerTopRight    = 1 << 1,
    UIRectCornerBottomLeft  = 1 << 2,
    UIRectCornerBottomRight = 1 << 3,
    UIRectCornerAllCorners  = ~0UL
};

Setting corner-radius for a view in Swift

The creation and masking of layers should run inside the optional drawRect() block inherited from UIView

    override func drawRect(rect: CGRect) {
        super.drawRect(rect)

        let maskPath = UIBezierPath(roundedRect: self.view.bounds, byRoundingCorners: [.TopLeft, .BottomLeft, .BottomRight], cornerRadii: CGSizeMake(10, 10))
        let maskLayer = CAShapeLayer()
        maskLayer.frame = self.view.bounds
        maskLayer.path  = maskPath.CGPath
        self.view.layer.mask = maskLayer
    }

I know it's very late, but i just create one method where you can pass only one or multiple UIRectCorners.

  [self setMaskTo:myView byRoundingCorners:(UIRectCornerTopLeft|UIRectCornerTopRight)];

- (void)setMaskTo:(UIView*)view byRoundingCorners:(UIRectCorner)corners
        {
            UIBezierPath *rounded = [UIBezierPath bezierPathWithRoundedRect:view.bounds
                                                          byRoundingCorners:corners
                                                                cornerRadii:CGSizeMake(8.0, 8.0)];
            CAShapeLayer *shape = [[CAShapeLayer alloc] init];
            [shape setPath:rounded.CGPath];
            view.layer.mask = shape;
    }

hope this will help you

your above code running perfectly on my machine , may be you set CAShapeLayer frame equal to your view frame due to which your view will disappear but i am not seeing this line in your code ,so please check your view property and apply below code

  UIBezierPath *maskPath;
    maskPath = [UIBezierPath bezierPathWithRoundedRect:viewName.bounds
                                     byRoundingCorners:(UIRectCornerBottomLeft | UIRectCornerBottomRight |UIRectCornerTopLeft)
                                           cornerRadii:CGSizeMake(20.0, 20.0)];
    CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
    maskLayer.frame =viewName.bounds; 
    maskLayer.path = maskPath.CGPath;
   viewName.layer.mask = maskLayer;
UIBezierPath *maskPath;
maskPath = [UIBezierPath bezierPathWithRoundedRect:someView.bounds 
                             byRoundingCorners:(UIRectCornerTopLeft|UIRectCornerTopRight|UIRectCornerBottomLeft|UIRectCornerBottomRight) 
                                   cornerRadii:CGSizeMake(10.0,10.0,5.0, 10.0)];


CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.bounds;
maskLayer.path = maskPath.CGPath;
someView.layer.mask = maskLayer;

Try this code

-(void)setMaskTo:(UIView*)view byRoundingCorners:(UIRectCorner)corners {
    UIBezierPath* rounded = [UIBezierPath bezierPathWithRoundedRect:view.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(10.0, 10.0)];
    CAShapeLayer* shape = [[CAShapeLayer alloc] init];
    [shape setPath:rounded.CGPath];
    view.layer.mask = shape;
}

call using

[self setMaskTo:myView byRoundingCorners:UIRectCornerTopLeft|UIRectCornerTopRight];

Available options:

UIRectCornerTopLeft, UIRectCornerTopRight,UIRectCornerBottomLeft,UIRectCornerBottomRight,UIRectCornerAllCorners

use this code corner radius of view only two sides.after long time i got suggestion ios. here viewFilter is view outlet which we want rounded.

-(void) viewDidAppear:(BOOL)animated{
[super viewDidAppear:animated];
[self setMaskTo:viewFilter byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight];
}

-(void)setMaskTo:(UIView*)view byRoundingCorners:(UIRectCorner)corners{

UIBezierPath *rounded = [UIBezierPathbezierPathWithRoundedRect:view.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(20.0, 20.0)];

CAShapeLayer *shape = [[CAShapeLayer alloc] init];
shape.frame = self.view.bounds;
[shape setPath:rounded.CGPath];
view.layer.mask = shape;
}

On iOS 11, What you only need is the maskedCorners.

    let cornerRadius: CGFloat = 6.0
    if #available(iOS 11, *) {
        productImageView.layer.cornerRadius  = cornerRadius
        productImageView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]

    } else {
        let path        = UIBezierPath(roundedRect: bounds, byRoundingCorners: [.topLeft , .topRight], cornerRadii:CGSize(width: cornerRadius, height: cornerRadius))
        let maskLayer   = CAShapeLayer()
        maskLayer.frame = bounds
        maskLayer.path  = path.cgPath
        productImageView.mask                = maskLayer
        productImageView.layer.masksToBounds = true
    }

I don't understand why everyone writes extensions to UIView ? After all, other developers will look for corner radius in CALayer . Add extension to the correct classes, otherwise other team members will never see it ((.

import UIKit

extension CALayer {
    func corner(radius: CGFloat, corners: UIRectCorner = .allCorners) {
        if #available(iOS 11.0, *) {
            masksToBounds = true
            cornerRadius = radius
            maskedCorners = corners.caCornerMask
        } else {
            let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
            let shapeLayer = CAShapeLayer()
            shapeLayer.path = path.cgPath
            mask = shapeLayer
            setNeedsDisplay()
        }
    }
}

extension UIRectCorner {
    /// convert UIRectCorner to CACornerMask
    var caCornerMask: CACornerMask {
        var cornersMask = CACornerMask()
        if self.contains(.topLeft) {
            cornersMask.insert(.layerMinXMinYCorner)
        }
        if self.contains(.topRight) {
            cornersMask.insert(.layerMaxXMinYCorner)
        }
        if self.contains(.bottomLeft) {
            cornersMask.insert(.layerMinXMaxYCorner)
        }
        if self.contains(.bottomRight) {
            cornersMask.insert(.layerMaxXMaxYCorner)
        }
        return cornersMask
    }
}

use like this

youView.layer.corner(radius: 20, corners: [.topLeft, .bottomLeft, .bottomRight])

SWIFT will suggest this method after typing youView.layer.corner and other team members will see it.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM