web-dev-qa-db-fra.com

Coins supérieurs arrondis d'un UIButton à Swift

Je sais que je peux contourner les quatre coins en utilisant:

 myBtn.layer.cornerRadius = 8
 myBtn.layer.masksToBounds = true

Comme je ne veux que deux tours, j’ai fait des recherches et trouvé this :

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
    }
}

Qui s'appelle comme ceci:

view.roundCorners([.TopLeft , .TopRight], radius: 10)

Pourtant, cela ne fonctionne pas pour un UIButton. Quand je change l'extension pour être de type UIButton et passe un bouton, la sortie ressemble à ceci:

 enter image description here

La question est, comment puis-je adapter cela pour travailler sur un UIButton?

iosswiftuibuttonrounded-corners
16
Dave G

Ajout d'une extension de 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
    }
}

Appel dans viewDidAppear/viewDidLayoutSubviews:

btnCorner.roundedButton()

Button Corner OutPut: 

 enter image description here

37
Kirit Modi

Pour Swift 3 La réponse de Kirit Modi est modifiée en:

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
   }
}

Au début du fichier d'extension, n'oubliez pas d'ajouter: 

import UIKit

Si vous voulez une extension pour un UIView avec l’option d’arrondir les coins supérieurs ou inférieurs, vous pouvez utiliser: 

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
   }
}

Qui s'appelle pour un bouton comme:

myButton.roundedCorners(top: true)
21
C. Kontos

Swift 4: à partir de la dernière iOS 11 

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
    }
}

Versions antérieures pour iOS (10,9, etc.) (fonctionne également pour iOS 11) 

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
}
13
Naishta

iOS 11 a vraiment facilité les arrondis. Le code ci-dessous arrondit les coins supérieur gauche et inférieur droit.

myView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMaxYCorner]
6
dsunku

Mettez à jour votre extension pour ressembler à ceci:

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()
    let rect = self.bounds
    mask.frame = rect
    mask.path = path.cgPath
    self.layer.mask = mask
}
}

Le calque de forme (masque) doit connaître le cadre 

5
Hossam Ghareeb

Vous avez oublié de définir le cadre de votre calque de forme:

mask.frame = layer.bounds
1
return true

Utilisez ce code,

let path = UIBezierPath(roundedRect:viewTo.bounds, byRoundingCorners:[.TopRight, .TopLeft], cornerRadii: CGSizeMake(20, 20))
let maskLayer = CAShapeLayer()
maskLayer.path = path.CGPath
viewTo.layer.mask = maskLayer

j'espère que c'est utile

0
Iyyappan Ravi