How do I change the color of the text in a UIPickerView under iOS 7?

Question

I'm aware of the pickerView:viewForRow:forComponent:reusingView method, but when using the view it passes in reusingView: how do I change it to use a different text color? If I use view.backgroundColor = [UIColor whiteColor]; none of the views show up anymore.

possible duplicate of [can I change the font color of the datePicker in iOS7?](http://stackoverflow.com/questions/18807940/can-i-change-the-font-color-of-the-datepicker-in-ios7) — Aaron Brager, Oct 08 '13 at 00:49
@AaronBrager. Que Not a duplicate the link provided by u is asked after this que. — Gajendra K Chauhan, Sep 08 '15 at 04:47

score 329 · Accepted Answer · edited Apr 18 '19 at 08:10

There is a function in the delegate method that is more elegant:

Objective-C:

- (NSAttributedString *)pickerView:(UIPickerView *)pickerView attributedTitleForRow:(NSInteger)row forComponent:(NSInteger)component
{
    NSString *title = @"sample title";
    NSAttributedString *attString = 
        [[NSAttributedString alloc] initWithString:title attributes:@{NSForegroundColorAttributeName:[UIColor whiteColor]}];

    return attString;
}

If you want to change the selection bar colors as well, I found that I had to add 2 separate UIViews to the view containing the UIPickerView, spaced 35 pts apart for a picker height of 180.

Swift 3:

func pickerView(_ pickerView: UIPickerView, attributedTitleForRow row: Int, forComponent component: Int) -> NSAttributedString? {

    let string = "myString"
    return NSAttributedString(string: string, attributes: [NSForegroundColorAttributeName:UIColor.white])
}

Swift 4:

func pickerView(_ pickerView: UIPickerView, attributedTitleForRow row: Int, forComponent component: Int) -> NSAttributedString? {

    let string = "myString"
    return NSAttributedString(string: string, attributes: [NSAttributedStringKey.foregroundColor: UIColor.white])
}

Swift 4.2:

func pickerView(_ pickerView: UIPickerView, attributedTitleForRow row: Int, forComponent component: Int) -> NSAttributedString? {

    let string = "myString"
    return NSAttributedString(string: string, attributes: [NSAttributedString.Key.foregroundColor: UIColor.white])
}

Remember when you use the method: You don't need to implement titleForRowInComponent() as it is never called when using attributedTitleForRow().

By far this is the best answer as it also works for picker views with more than one component. — PKCLsoft, Feb 04 '14 at 04:22

score 29 · Answer 2 · edited Jul 17 '18 at 01:44

Original post here: can I change the font color of the datePicker in iOS7?

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
{
    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, pickerView.frame.size.width, 44)];
    label.backgroundColor = [UIColor grayColor];
    label.textColor = [UIColor whiteColor];
    label.font = [UIFont fontWithName:@"HelveticaNeue-Bold" size:18];
    label.text = [NSString stringWithFormat:@" %d", row+1];
    return label;
}

// number Of Components
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
    return 1;
}

// number Of Rows In Component
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:   (NSInteger)component
{
    return 6;
}

This solution works fine for a pickerview containing a single component. If you have more than 1, the labels will overlap from what I can see. — PKCLsoft, Feb 04 '14 at 04:23

score 23 · Answer 3 · edited Jul 17 '18 at 01:37

23

Go to storyboard
Select PickerView
Go to Identity inspector (3rd tab)
Add User Defined Runtime Attribute
KeyPath = textColor
Type = Color
Value = [Color of you choice]

screenshot

edited Jul 17 '18 at 01:37

Pang

9,564
146
81
122

answered May 07 '14 at 14:18

Lancewise

231
2
2

Please explain your answer – Gwenc37 May 07 '14 at 14:39
12

it's work in a half, cus text is black but when u scroll it on picker he change to white – Shial May 13 '14 at 14:02
4

Works only if you scroll – cvb Jan 14 '15 at 22:45
Hi @chris-van-buskirk Check my add-on [_thePrettyPicker selectRow:prettyIndex inComponent:0 animated:YES]; – WINSergey Jan 10 '16 at 20:36

score 7 · Answer 4 · answered May 16 '15 at 14:51

in Xamarin, override the UIPickerModelView method GetAttributedTitle

public override NSAttributedString GetAttributedTitle(UIPickerView picker, nint row, nint component)
{
    // change text white
    string title = GetTitle (picker, row, component); // get current text from UIPickerViewModel::GetTitle
    NSAttributedString ns = new NSAttributedString (title, null, UIColor.White); // null = font, use current font
    return ns;
}

score 7 · Answer 5 · answered Jan 24 '20 at 08:21

7

It works for me

pickerView.setValue(UIColor.yellow, forKeyPath: "textColor")

answered Jan 24 '20 at 08:21

logeshpalani31

1,416
12
33

score 2 · Answer 6 · edited Mar 23 '14 at 21:44

I ran into the same problem with a pickerView using two components. My solution is similar to above with a few modifications. Because I am using two components it is necessary to pull from two different arrays.

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

    UILabel *label = [[UILabel alloc] init];
    label.backgroundColor = [UIColor blueColor];
    label.textColor = [UIColor whiteColor];
    label.font = [UIFont fontWithName:@"HelveticaNeue-Bold" size:18];

    //WithFrame:CGRectMake(0, 0, pickerView.frame.size.width, 60)];

    if(component == 0)
    {
        label.text = [countryArray objectAtIndex:row];
    }
    else
    {
        label.text = [cityArray objectAtIndex:row];
    }
    return label;
}

score 2 · Answer 7 · edited Jul 17 '18 at 01:37

2

Swift 4 (Update to the accepted answer)

extension MyViewController: UIPickerViewDelegate{
    }

    func pickerView(_ pickerView: UIPickerView, attributedTitleForRow row: Int, forComponent component: Int) -> NSAttributedString? {
        return NSAttributedString(string: "your-title-goes-here", attributes: [NSAttributedStringKey.foregroundColor: UIColor.white])
    }
}

edited Jul 17 '18 at 01:37

Pang

9,564
146
81
122

answered Dec 11 '17 at 10:13

harsh_v

3,193
3
34
53

score 1 · Answer 8 · answered Dec 23 '16 at 05:33

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view {
        UILabel* pickerLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, pickerView.frame.size.width, 37)];
        pickerLabel.text = @"text";
        pickerLabel.textColor = [UIColor redColor];
        return pickerLabel;
}

How do I change the color of the text in a UIPickerView under iOS 7?

8 Answers8

Linked