How to change the Font size in UIPickerView?

Question

I have one UIPickerView. This is having nearly 200 items, each items has long texts, so, i want to resize the UIPickerView's font size. How can i change it? It is possible? Can any one help me? Thanks !

Yuva.M

Answer 1

You need to implement pickerView:viewForRow:forComponent:reusingView: method in picker's delegate

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{
    UILabel* tView = (UILabel*)view;
    if (!tView){
        tView = [[UILabel alloc] init];
            // Setup label properties - frame, font, colors etc
            ...
    }
    // Fill the label text here
    ...
    return tView;
}

Answer 2

Update in Swift for iOS8, you can add this to your delegate:

func pickerView(pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusingView view: UIView!) -> UIView {

    var pickerLabel = view as? UILabel;

    if (pickerLabel == nil)
    {
        pickerLabel = UILabel()

        pickerLabel?.font = UIFont(name: "Montserrat", size: 16)
        pickerLabel?.textAlignment = NSTextAlignment.Center
    }

    pickerLabel?.text = fetchLabelForRowNumber(row)

    return pickerLabel!;
}

Answer 3

Swift 4: to update @Alessandro Ornano answer and avoid Force_cast violation error:

func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {
    var label = UILabel()
    if let v = view as? UILabel { label = v }
    label.font = UIFont (name: "Helvetica Neue", size: 10)
    label.text =  dataArray[row]
    label.textAlignment = .center
    return label
}

Answer 4

---

For Font adjustment of UIPickerView Rows

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
{
    UILabel* pickerLabel = (UILabel*)view;

    if (!pickerLabel)
    {
        pickerLabel = [[UILabel alloc] init];

        pickerLabel.font = [UIFont fontWithName:@"SourceSansPro-Semibold"                size:16];

        pickerLabel.textAlignment=NSTextAlignmentCenter;
    }
    [pickerLabel setText:[self.data objectAtIndex:row]];

    return pickerLabel;
}

Answer 5

Try this, it should help:

  - (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{
UILabel* tView = (UILabel*)view;
if (!tView){
tView = [[UILabel alloc] init];
// Setup label properties - frame, font, colors etc
...
//adjustsFontSizeToFitWidth property to YES
tView.minimumFontSize = 8.;
tView.adjustsFontSizeToFitWidth = YES;
}
// Fill the label text here
...
return tView;
}


// altro modo completo sembrerebbe...
- (UIView *)pickerView:(UIPickerView *)pickerView
viewForRow:(NSInteger)row
forComponent:(NSInteger)component
reusingView:(UIView *)view {

UILabel *pickerLabel = (UILabel *)view;

if (pickerLabel == nil) {
CGRect frame = CGRectMake(0.0, 0.0, 80, 32);
pickerLabel = [[[UILabel alloc] initWithFrame:frame] autorelease];
[pickerLabel setTextAlignment:UITextAlignmentLeft];
[pickerLabel setBackgroundColor:[UIColor clearColor]];
[pickerLabel setFont:[UIFont boldSystemFontOfSize:15]];
}

[pickerLabel setText:[pickerDataArray objectAtIndex:row]];

return pickerLabel;

}

Answer 6

Swift 3 | AUTOSHRINK

Set adjustsFontSizeToFitWidth=true and minimumScaleFactor=0.5

func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {

    var label: UILabel
    if let view = view as? UILabel { label = view }
    else { label = UILabel() }

    label.text = "My Picker Text"
    label.textAlignment = .center
    label.font = UIFont.boldSystemFont(ofSize: 20)
    label.adjustsFontSizeToFitWidth = true
    label.minimumScaleFactor = 0.5

    return label
}

Answer 7

Swift 4.x

func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {
        var label = UILabel()
        if let v = view {
            label = v as! UILabel
        }
        label.font = UIFont (name: "Helvetica Neue", size: 10)
        label.text =  dataArray[row]
        label.textAlignment = .center
        return label
    }

Answer 8

For Objective c

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{

    UILabel* pickerLabel = (UILabel*)view;
    if (!pickerLabel){
        pickerLabel = [[UILabel alloc] init];
        // Setup label properties - frame, font, colors etc
        [pickerLabel setFont:[UIFont fontWithName:LATO_REGULAR_FONT size:SIZE_SEMIBOLD_FONT]];
        pickerLabel.textColor = primaryTextColor;
        pickerLabel.textAlignment = NSTextAlignmentCenter;


    }
    // Fill the label text here
    pickerLabel.text = self.dataSourceArray[row];

    return pickerLabel;
}

For Swift 2.3

  func pickerView(pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusingView view: UIView?) -> UIView{

        var label = view as! UILabel!
        if label == nil {
            label = UILabel()
        }

        label.font = LATO_REGULAR_FONT_17
        label.text =  dataArray[row] as? String
        label.textAlignment = .Center
        return label

    }

Answer 9

To set the system font, need to do bit differently, like below:

let pickerLabel = UILabel()
pickerLabel.font = UIFont.systemFont(ofSize: 20.0, weight: .medium)

you can choose any weight like regular, bold, etc

Answer 10

Clean Swift solution without force unwrapping

func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {
    let label = (view as? UILabel) ?? UILabel()
    
    // setup label
    
    return label
}

Answer 11

Most answers provide solution for center aligned label. I had to align text to the left side and faced the fact text has been cut off. Adding margin to left solved the problem for me. Solution works for swift 5.

    func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {
        
        let pickerLabel: UILabel
        
        if let label = view as? UILabel {
            pickerLabel = label
        } else {
            pickerLabel = UILabel()
            // Customize text
            pickerLabel.font = pickerLabel.font.withSize(20)
            pickerLabel.textAlignment = .left
            pickerLabel.textColor = UIColor.secondaryLabel
            // Create a paragraph with custom style
            // We only need indents to prevent text from being cut off
            let paragraphStyle = NSMutableParagraphStyle()
            paragraphStyle.firstLineHeadIndent = 12 // May vary
            // Create a string and append style to it
            let attributedString = NSMutableAttributedString(string: subjects[row])
            attributedString.addAttribute(.paragraphStyle, value: paragraphStyle, range: NSRange(location: 0, length: attributedString.length))
            // Update label's text
            pickerLabel.attributedText = attributedString
        }
        
        return pickerLabel
    }

Answer 12

For RxSwift users, please take away this.

        Observable.just(["option1", "option2", "option3"])
            .bind(to: pickerView.rx.items) { row, option, view in
                let label = (view as? UILabel) ?? .init()
                
                label.font = .preferredFont(forTextStyle: .title1)
                label.adjustsFontSizeToFitWidth = true
                label.minimumScaleFactor = 0.5
                label.text = option
                label.textAlignment = .center
                
                return label
            }
            .disposed(by: bag)

Using iOS predefined title1 font so it can resize according to user's display settings; setting minimumScaleFactor to 0.5 so font can shrink on long text.

One thing to notice is that UIPickerView doesn't seem to allow multi-lines text, even by doing label.numberOfLines = 2 // or 0 won't do you any favour, I guess it is just not designed for displaying long text options.

Answer 13

Readable Swift version without ! or unnecessary reconfigurations

func pickerView(_ pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusing view: UIView?) -> UIView {
    let label: UILabel = (view as? UILabel) ?? {
        let label: UILabel = UILabel()
        label.font = UIFont.systemFont(ofSize: 12)
        label.textAlignment = .center
        return label
    }()
    label.text = self.pickerView(pickerView, titleForRow: row, forComponent: component)
    return label
}

func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
    items[row].title
}