'UIButton label text is being clipped

I have a UIButton built in Interface Builder that has a default label. In Xcode, I'm changing the label text dynamically like so:

myButton.titleLabel.text = @"this is the new label";

However, when the text updates, the new string is being clipped down to the same size as the original string and ends up looking like:

this...label

Anyone know why this is happening?

iphonecocoa-touchuibutton


Solution 1:[1]

You should use setTitle:forState: to change the title of a UIButton. If you change the title yourself, the button has no indication that it needs to resize the label – you'd end up having to do something like this:

myButton.titleLabel.text = @"this is the new label";
[myButton setNeedsLayout];

but I'm not even sure that would work in all cases. Methods like setTitle:forState: are provided so that you can provide titles for multiple states without having to update the button manually, and so that the button knows that it needs to be laid out with a new title.

Solution 2:[2]

Try using the button's setTitle method (rather than setting the title directly on the label). It should force the title label to be resized.

Objective C:

[myButton setTitle:@"This is the text" forState:UIControlStateNormal];

Or in Swift:

myButton.setTitle("This is the text", for: .normal)

Solution 3:[3]

An alternative solution is to let the UIButton's inner UILabel to shrink the font size, as UILabels can do :

button.titlelabel.minimumFontSize = 8.0; // or some more adequate size
self.buttonWithLongTitle.titleLabel.adjustsFontSizeToFitWidth = YES;

Solution 4:[4]

Call sizeToFit on your button. This will resize the button to fit the text.

Solution 5:[5]

If that didn't work you can always determine the string size and adjust the button frame width. In that case you are sure it will fit.

// Calculate the size 
CGSize buttonSize = [@"My text.." sizeWithFont:[UIFont systemFontOfSize:15.0]
                    constrainedToSize:someSize lineBreakMode:UILineBreakModeWordWrap];

// Do whatever you want with the "buttonSize", you can for example adjust your button's frame width

Solution 6:[6]

Solution in Swift 4.2

yourButton.titleLabel?.minimumScaleFactor = 0.5 //set whatever you want here to scale
yourButton.titleLabel?.adjustsFontSizeToFitWidth = true

Solution for Objective C

[yourButton.titleLabel setMinimumScaleFactor:0.5];
[yourButton.titleLabel setAdjustsFontSizeToFitWidth:YES];

Solution 7:[7]

This worked for me while setting my button up programmatically with all other constraints. 

       yourButton.widthAnchor.constraint(equalToConstant: yourButton.intrinsicContentSize.width).isActive = true

You can also add "padding" like so 

       yourButton.contentEdgeInsets = UIEdgeInsets(top: 0, left: 15, bottom: 0, right: 15)

Solution 8:[8]

Use Autoresizing mask if not selected.

enter image description here

Solution 9:[9]

None of the solutions above worked for me. What did was sublclassing UIButton and re-setting the frame of the titleLabel:

Context: My font was Josefin Sans and it does clipping the top part of "Ñ". I can imagine it could happen with any other text using a different font.

open class Button: UIButton {

    open override func layoutSubviews() {
        super.layoutSubviews()

        guard let titleLabel = titleLabel else {
            return
        }
        // Play around to get these numbers
        let heightToAdd: CGFloat = 15 
        let widthToAdd: CGFloat = 100

        titleLabel.frame = CGRect(
            origin: CGPoint(
              x: titleLabel.frame.origin.x - widthToAdd / 2, 
              y: titleLabel.frame.origin.y - heightToAdd / 2),
            size: CGSize(
              width: titleLabel.frame.width + widthToAdd, 
              height: titleLabel.frame.height + heightToAdd
            )
        );
    }

}

Play around with the values widthToAdd and heightToAdd or make them injectable when setting a new title.

It is not a superb solution, but it was the only think that worked for me.

Related Questions