Fitting button text size to match button size

Question

This image shows what I am trying to achieve:

I am specifying the width of 2 buttons, to be the same as 0.4*redViewWidth and height 0.8*redViewheight. Than I want the text size to be in 2 lines and as big as possible to still fit into the buttons frames. I am using custom font and no auto-layout. To my surprise, this doesn't happen. The text is in 2 lines, but the text font size is too large and definitively not fitting button size. Where did I go wrong?

edit: redView uses autolayout. Populating redView with buttons uses none.

let font = UIFont(name: "customfont", size: 19)
    button1 = UIButton()
    button2 = UIButton()

    button1.frame = CGRectMake(navigationBarView.frame.width*0.6, navigationBarView.frame.height*0.1, navigationBarView.frame.width*0.4, navigationBarView.frame.height*0.8)
    button2.frame = CGRectMake(navigationBarView.frame.width*0.2, navigationBarView.frame.height*0.1, navigationBarView.frame.width*0.4, navigationBarView.frame.height*0.8)


    button1.setTitle("button2\ntext text text text", forState: UIControlState.Normal)
    button1.titleLabel?.textAlignment = NSTextAlignment.Center
    button1.titleLabel?.lineBreakMode = NSLineBreakMode.ByWordWrapping
    button1.titleLabel?.font=font
    button1.titleLabel?.adjustsFontSizeToFitWidth=true
    button1.titleLabel?.minimumScaleFactor = 0.1
    button2.setTitle("button1\ntext text text text", forState: UIControlState.Normal)
    button2.titleLabel?.textAlignment = NSTextAlignment.Center
    button2.titleLabel?.lineBreakMode = NSLineBreakMode.ByWordWrapping
    button2.titleLabel?.font=font
    button2.titleLabel?.adjustsFontSizeToFitWidth=true
    button2.titleLabel?.minimumScaleFactor = 0.1

score 0 · Answer 1 · edited May 23 '17 at 11:53

0

You need to specify the number of lines for the UILabel as follows:

button1.titleLabel?.numberOfLines = 2
button2.titleLabel?.numberOfLines = 2

EDIT: Taken from Dynamically changing font size of UILabel Apparently auto sizing a label's font size only works when you have a single line. The code below will auto size a UILabel, and should be simple enough to edit for a UIButton (however, this is in Objective-C...).

Starting with iOS7, sizeWithFont becomes deprecated. Multiline case is reduced to:

factLabel.numberOfLines = 0;
factLabel.lineBreakMode = NSLineBreakByWordWrapping;
CGSize maximumLabelSize = CGSizeMake(factLabel.frame.size.width, CGFLOAT_MAX);
CGSize expectSize = [factLabel sizeThatFits:maximumLabelSize];
factLabel.frame = CGRectMake(factLabel.frame.origin.x, factLabel.frame.origin.y, expectSize.width, expectSize.height);

edited May 23 '17 at 11:53

Community

1
1

answered Feb 16 '16 at 09:18

David Cao

525
3
11

actually, the title label is in 2 lines already with this aproach. the problem is that text font size doesn't adjust to match the frame of buttons. – potato Feb 16 '16 at 09:21
Take a look at the edit, another approach would be to iterate through font sizes and check the lineHeight property for each one, which seems a bit hacky, though. – David Cao Feb 16 '16 at 09:31
thanks for stopping by. Pardon me, if I misunderstood the code.. I think this changes the buttons frame, to fit whatever text there is in it's title. In my case the frame is fixed- always 0.4*redViewWidth. It is the font size that need to change to take into account different screens of iOS devices. – potato Feb 16 '16 at 09:43

score 0 · Answer 2 · answered Feb 16 '16 at 10:28

I ended up with something like this. It checks the screen width and assigns font size accordingly. Hardcoded, but it does the trick.

let screenRect = UIScreen.mainScreen().bounds
        let screenWidth = screenRect.size.width;

var fontSize = 15
        if screenWidth>410{
            fontSize = 19
        }else if screenWidth>370{
            fontSize = 17
        }else{
            fontSize = 15

        }
        let font = UIFont(name: "customfont", size: CGFloat(fontSize))

Fitting button text size to match button size

2 Answers2