UILabel has internal padding from programmatic constraints

Question

So, I don't know why this is happening, but here is a pic depicting it.

If you look at the UILabel with green background, there is padding above and below it, but I don't know why that is.

This is how I create it:

var bodyLabel: ActiveLabel = {
    let label = ActiveLabel()
    label.translatesAutoresizingMaskIntoConstraints = false
    label.isUserInteractionEnabled = false
    label.backgroundColor = .green
    label.numberOfLines = 0
    label.textColor = .darkGray
    label.font = UIFont.systemFont(ofSize: MessageTableViewCell.defaultFontSize())

    label.enabledTypes = [.mention]
    label.mentionColor = .gray //Figure this out

    return label
}()

The fact that it is an ActiveLabel is not the reason why this is happening.

Here are all the constraints it is involved in:

self.contentView.addSubview(self.thumbnailView)
self.contentView.addSubview(self.titleLabel)
self.contentView.addSubview(self.bodyLabel)
self.contentView.addSubview(self.likeView)

let views = ["thumbnailView" : self.thumbnailView,
                 "titleLabel" : self.titleLabel,
                 "bodyLabel" : self.bodyLabel,
                 "likeView"  : self.likeView] as [String : Any]

let metrics = ["tumbSize" : Constants.kMessageTableViewCellAvatarHeight,
                   "padding" : 15,
                   "right" : 10,
                   "left" : 5]

self.contentView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-left-[thumbnailView(tumbSize)]-right-[titleLabel(>=0)]-right-|", options: [], metrics: metrics, views: views))
self.contentView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-left-[thumbnailView(tumbSize)]-right-[bodyLabel(>=0)]-right-|", options: [], metrics: metrics, views: views))
self.contentView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-right-[thumbnailView(tumbSize)]-(>=0)-|", options: [], metrics: metrics, views: views))

if self.reuseIdentifier == Constants.MessageCellIdentifier {
    self.contentView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-right-[titleLabel(20)]-left-[bodyLabel(>=0@999)]-left-|", options: [], metrics: metrics, views: views))
} else {
    self.contentView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[titleLabel]|", options: [], metrics: metrics, views: views))
}

I noticed that when I remove the constraint in the if statement, that obviously the views get into awkward positions, but I do notice that it no longer has that green padding. I'm really not sure what is causing this padding.

This is what the code is based on.

score 1 · Accepted Answer · answered Oct 10 '16 at 02:37

1

Well, you're adding that padding by wrapping that body label with the left value.

So instead of: V:|-right-[titleLabel(20)]-left-[bodyLabel(>=0@999)]-left-|

Do something like: V:|-right-[titleLabel(20)][bodyLabel(>=0@999)]|

That will remove both top and bottom padding. I hope that helps!

answered Oct 10 '16 at 02:37

DZenBot

4,806
2
25
27

I actually tried that and it didn't help either. That affects the space right between the label in red and the green. It doesn't actually affect the label itself. At this point I'm thinking of maybe trying to use a custom XIB. I think it might have to do with enforcing a minimum height on the cells, but even when I type a few lines worth within the green, that space still stays. – David Oct 10 '16 at 02:42
I ended up creating a XIB which really helped show me what was going on. This was basically correct, but I needed to make a change elsewhere to really get what I want. – David Oct 10 '16 at 05:52

score 0 · Answer 2 · edited May 23 '17 at 12:13

0

You need to set edges to UILabel.

refer following link for solution : iOS Add left padding to UILabel

edited May 23 '17 at 12:13

Community

1
1

answered Oct 10 '16 at 05:19

KKRocks

8,222
1
18
84

UILabel has internal padding from programmatic constraints

2 Answers2