Corner radius only for top and bottom left corner of a view

Question

I need to round corner only the top left and bottom left of a view, so i tried this:

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
{
    let cell = tableView.dequeueReusableCell(withIdentifier: "teamCell", for: indexPath) as! TeamCell

    let view = cell.backgroundCellView
    let rectShape = CAShapeLayer()
    rectShape.bounds = (view?.frame)!
    rectShape.position = (view?.center)!
    rectShape.path = UIBezierPath(roundedRect: (view?.bounds)!, byRoundingCorners: [.topRight, .topLeft], cornerRadii: CGSize(width: 20, height: 20)).cgPath
    view?.layer.mask = rectShape
    view?.layer.masksToBounds = true

    return cell
}

and it worked very well, but after I put the constraints (trailing, leading, top and botton - i need a responsive view) only the topLeft corner is rounded and not the other. How could i fix it?

in cellForRow, after calling dequeueReusableCell method (I'm going to edit my question) — Fabio Cenni, Sep 10 '16 at 12:51
You should try moving it to your `UITableViewCell` subclass's `layoutSubviews` method, after calling `super.layoutSubviews()` — beyowulf, Sep 10 '16 at 12:53
Putting the code that builds the mask into the cell's laoutSubviews is the correct answer. @beyowulf, you should post that as an answer so the OP can accept it. — Duncan C, Sep 10 '16 at 13:12
Possible duplicate of [UIView in cell -- Can't round right-hand corners](http://stackoverflow.com/questions/26934231/uiview-in-cell-cant-round-right-hand-corners) — beyowulf, Sep 10 '16 at 13:25
just tried, does not work... I think that to solve the problem i have to change constraints (whiteout them the code word so fine)... but i need to make the view responsive... — Fabio Cenni, Sep 10 '16 at 14:45

score 8 · Answer 1 · answered Dec 14 '17 at 15:07

8

Starting with iOS 11, and Swift 4, you can use maskedCorners:

let myView = UIView()

myView.layer.cornerRadius = 15
myView.clipsToBounds = true

// Top Left Corner: .layerMinXMinYCorner
// Top Right Corner: .layerMaxXMinYCorner
// Bottom Left Corner: .layerMinXMaxYCorner
// Bottom Right Corner: .layerMaxXMaxYCorner
myView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMinXMaxYCorner]

answered Dec 14 '17 at 15:07

Gene Loparco

2,157
23
23

Thanks only this answer worked for me :) – The iCoder Mar 10 '22 at 17:19
My pleasure! Glad it worked for you :-) – Gene Loparco Mar 11 '22 at 20:07

score 2 · Answer 2 · answered Sep 10 '16 at 13:05

2

try this one

 let path = UIBezierPath(roundedRect:viewToRound.bounds, byRoundingCorners:[.TopLeftt, .BottomLeft], cornerRadii: CGSizeMake(20, 20))
    let maskLayer = CAShapeLayer()
    maskLayer.path = path.CGPath
    view.layer.mask = maskLayer

answered Sep 10 '16 at 13:05

Ram Mani

1,009
1
10
15

score 2 · Accepted Answer · answered Sep 10 '16 at 22:07

A simple way to do this is to set the corner radius of your cell's content view, and then to prevent the right side corners of the contents from being rounded you could constrain them to have x trailing space to the content view (where x is your corner radius). This does require you to adjust your layout to account for the extra padding on the right side of your cells though.

score -2 · Answer 4 · answered Sep 10 '16 at 12:57

-2

Try using

view?.layer.cornerRadius = 15

insted of

rectShape.path = UIBezierPath(roundedRect: (view?.bounds)!, byRoundingCorners: [.topRight, .topLeft], cornerRadii: CGSize(width: 20, height: 20)).cgPath

answered Sep 10 '16 at 12:57

Arya K

53
1
6

1

That will round all 4 corners – Duncan C Sep 10 '16 at 13:12

Corner radius only for top and bottom left corner of a view

4 Answers4