Is there a way for UILabel to draw a border around itself? This is useful for me to debug the text placement and to see the placement and how big the label actually is.
9 Answers
You can set label's border via its underlying CALayer property:
#import <QuartzCore/QuartzCore.h>
myLabel.layer.borderColor = [UIColor greenColor].CGColor
myLabel.layer.borderWidth = 3.0
Swift 5:
myLabel.layer.borderColor = UIColor.darkGray.cgColor
myLabel.layer.borderWidth = 3.0

- 6,834
- 3
- 32
- 39

- 170,431
- 36
- 387
- 313
-
Compiler complaints that there is no definition of borderColor and borderWidth within CALayer. – Boon Feb 22 '10 at 15:15
-
2they're available only starting SDK 3.0 :( If you want just a quick solution for debugging purpose you can set semitransparent colored background for your label. – Vladimir Feb 22 '10 at 15:22
-
36If the compiler complains then you probably forgot to `#import
` – Stefan Arentz Feb 22 '10 at 15:37 -
Make sure you set the border width, because I guess it defaults to zero, and you won't see it if you don't set it. – Tyler Collier Nov 23 '11 at 21:56
-
1@Vladimir This solution is adding the border to all the sides of the label. Can we add the border only the right side of the label ??? – chinthakad Apr 20 '12 at 06:08
-
1@chinthakad, no. I think you'll need custom label subclass with custom drawing for that – Vladimir Apr 20 '12 at 06:19
-
3In Swift the first line would read: `myLabel.layer.borderColor = UIColor.greenColor().CGColor` – Roshambo Jan 21 '15 at 22:17
Here are some things you can do with UILabel
and its borders.
Here is the code for those labels:
import UIKit
class ViewController: UIViewController {
@IBOutlet weak var label1: UILabel!
@IBOutlet weak var label2: UILabel!
@IBOutlet weak var label3: UILabel!
@IBOutlet weak var label4: UILabel!
@IBOutlet weak var label5: UILabel!
@IBOutlet weak var label6: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
// label 1
label1.layer.borderWidth = 1.0
// label 2
label2.layer.borderWidth = 5.0
label2.layer.borderColor = UIColor.blue.cgColor
// label 3
label3.layer.borderWidth = 2.0
label3.layer.cornerRadius = 8
// label 4
label4.backgroundColor = UIColor.cyan
// label 5
label5.backgroundColor = UIColor.red
label5.layer.cornerRadius = 8
label5.layer.masksToBounds = true
// label 6
label6.layer.borderWidth = 2.0
label6.layer.cornerRadius = 8
label6.backgroundColor = UIColor.yellow
label6.layer.masksToBounds = true
}
}
Note that in Swift there is no need to import QuartzCore
.
See also
-
4How were you able to get those paddings? My text is touching the borders... – eestein Nov 16 '16 at 15:32
-
1@eestein, I think I just dragged the label size bigger in the Interface Builder. Or I might have set size constraints on them. – Suragch Nov 17 '16 at 00:29
Swift version:
myLabel.layer.borderWidth = 0.5
myLabel.layer.borderColor = UIColor.greenColor().CGColor
For Swift 3:
myLabel.layer.borderWidth = 0.5
myLabel.layer.borderColor = UIColor.green.cgColor

- 862
- 8
- 18

- 38,543
- 21
- 161
- 168
Swift 3/4 with @IBDesignable
While almost all the above solutions work fine but I would suggest an @IBDesignable
custom class for this.
@IBDesignable
class CustomLabel: UILabel {
/*
// Only override draw() if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
override func draw(_ rect: CGRect) {
// Drawing code
}
*/
@IBInspectable var borderColor: UIColor = UIColor.white {
didSet {
layer.borderColor = borderColor.cgColor
}
}
@IBInspectable var borderWidth: CGFloat = 2.0 {
didSet {
layer.borderWidth = borderWidth
}
}
@IBInspectable var cornerRadius: CGFloat = 0.0 {
didSet {
layer.cornerRadius = cornerRadius
}
}
}

- 6,291
- 3
- 35
- 47
UILabel properties borderColor,borderWidth,cornerRadius in Swift 4
@IBOutlet weak var anyLabel: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
anyLabel.layer.borderColor = UIColor.black.cgColor
anyLabel.layer.borderWidth = 2
anyLabel.layer.cornerRadius = 5
anyLabel.layer.masksToBounds = true
}

- 1,317
- 2
- 27
- 60

- 506
- 6
- 13
-
Thanks! I used the info from this answer in my PaddedLabel with Border solution here: https://stackoverflow.com/a/67317976/826946. Also gave a link back to here. – Andy Weinstein Apr 29 '21 at 13:16
You can use this repo: GSBorderLabel
It's quite simple:
GSBorderLabel *myLabel = [[GSBorderLabel alloc] initWithTextColor:aColor
andBorderColor:anotherColor
andBorderWidth:2];

- 1,024
- 3
- 20
- 34
-
This deals with border around the actual characters in the text, the question is talking about borders around the rectangle the text is contained in. – jjxtra Mar 26 '13 at 15:11
it really depends on how many boarder use in your view , sometimes , just add a UIVIEW which the size is a bit bigger to create the border . the method is faster than produce a view

- 1,859
- 24
- 24
Using an NSAttributedString string for your labels attributedText is probably your best bet. Check out this example.