Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How can I make a button have a rounded border in Swift?
In Swift, you can use the layer property of a UIButton to set the corner radius of its border. You can use the layer (CALayer) property to apply the border width and color to the button. Also, the same property provides access to the cornerRadius property to make the button rounded.
We will use the following steps to make a button rounded with a border
Step 1 − In this step, create a button object with basic customization.
Step 2 − In this step, add a border and corner radius to the button.
Step 3 − In this step, make the button rounded.
Example
In this step, you will create a button and do some basic customization. Here is the code.
import UIKit
class TestController: UIViewController {
private let loginButton = UIButton()
override func viewDidLoad() {
super.viewDidLoad()
initialSetup()
}
private func initialSetup() {
// basic setup
view.backgroundColor = .white
navigationItem.title = "UIButton"
// log in button customization
loginButton.setTitle("Button with rounded border", for: .normal)
loginButton.setTitleColor(.red, for: .normal)
// adding the constraints to the login button
view.addSubview(loginButton)
loginButton.translatesAutoresizingMaskIntoConstraints = false
loginButton.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
loginButton.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
loginButton.heightAnchor.constraint(equalToConstant: 50).isActive = true
loginButton.widthAnchor.constraint(equalToConstant: 280).isActive = true
}
}
Output
Add a border and corner radius
In this step, we will apply a corner radius and border width to the button. Here is an example −
Example
private func initialSetup() {
// basic setup
// log in button customization
// adding the constraints to the login button
addButtonBorder()
}
private func addButtonBorder() {
loginButton.layer.borderColor = UIColor.red.cgColor
loginButton.layer.borderWidth = 1.5
loginButton.layer.cornerRadius = 10.0
loginButton.layer.masksToBounds = true
}
Output
Make the button rounded with the border
In this step, we will make the button rounded with the border. Here is an example −
Example
private func initialSetup() {
// basic setup
// log in button customization
// adding the constraints to the login button
makeButtonRounded()
}
private func makeButtonRounded() {
loginButton.layer.borderColor = UIColor.red.cgColor
loginButton.layer.borderWidth = 1.5
loginButton.layer.cornerRadius = 25.0 // height / 2
loginButton.layer.masksToBounds = true
}
Output
Conclusion
In conclusion, to make a button have a rounded border in Swift, you can use the layer property of a UIButton to set the corner radius, border width, and border color.
5K+ Views
