Round Top Corners of a UIButton in Swift
Adding Extension of UIButton:
extension UIButton{ func roundedButton(){ let maskPath1 = UIBezierPath(roundedRect: bounds, byRoundingCorners: [.topLeft , .topRight], cornerRadii: CGSize(width: 8, height: 8)) let maskLayer1 = CAShapeLayer() maskLayer1.frame = bounds maskLayer1.path = maskPath1.cgPath layer.mask = maskLayer1 }}
Calling in viewDidAppear/viewDidLayoutSubviews:
btnCorner.roundedButton()
Button Corner OutPut:
Swift 4: For latest iOS 11 onwards
override func viewDidLoad() { super.viewDidLoad() if #available(iOS 11.0, *) { self.viewToRound.clipsToBounds = true viewToRound.layer.cornerRadius = 20 viewToRound.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner] } else { // Fallback on earlier versions }}
Earlier iOS (10,9 etc) Versions (works for iOS 11 too)
override func viewDidLayoutSubviews() { self.viewToRound.clipsToBounds = true let path = UIBezierPath(roundedRect: viewToRound.bounds, byRoundingCorners: [.topRight, .topLeft], cornerRadii: CGSize(width: 20, height: 20)) let maskLayer = CAShapeLayer() maskLayer.path = path.cgPath viewToRound.layer.mask = maskLayer}
For swift 3 Kirit Modi's answer is changed to:
extension UIButton { func roundedButton(){ let maskPAth1 = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: [.topLeft , .topRight], cornerRadii:CGSize(width:8.0, height:8.0)) let maskLayer1 = CAShapeLayer() maskLayer1.frame = self.bounds maskLayer1.path = maskPAth1.cgPath self.layer.mask = maskLayer1 }}
At the start of the extension's file don't forget to add:
import UIKit
If you want an extension for a UIView with the option of rounding top or bottom corners you can use:
extension UIView { func roundedCorners(top: Bool){ let corners:UIRectCorner = (top ? [.topLeft , .topRight] : [.bottomRight , .bottomLeft]) let maskPAth1 = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii:CGSize(width:8.0, height:8.0)) let maskLayer1 = CAShapeLayer() maskLayer1.frame = self.bounds maskLayer1.path = maskPAth1.cgPath self.layer.mask = maskLayer1 }}
Which is called for a button as:
myButton.roundedCorners(top: true)