Tuesday, March 12, 2019

Rounded Corner UIButton

I'm developing a pet project and I want to display the buttons with rounded corners as shown in the image below.


I subclassed the UIButton and override the layoutSubviews() method as following:
    
    public override func layoutSubviews() {
        super.layoutSubviews()
        
        self.layer.cornerRadius = 0.1 * bounds.size.width
    }
 

Concepts


Layers

Each view in Swift has one root layer, which might contain one or more sub layers. Layers are used to draw and animate the view's contents.


Corner Radius

The images below explain what the corner radius is. The longer the corner radius, the bigger rounded corner.





References

https://developer.apple.com/documentation/quartzcore/calayer
https://www.hackingwithswift.com/example-code/calayer/what-is-calayer


No comments:

Post a Comment