How to get Custom UIPickerView?

Syed Sharjeel Ali picture Syed Sharjeel Ali · Aug 6, 2014 · Viewed 8.1k times · Source

I want to achieve the following functionality in Custom UIPiker as shown in below picture.

enter image description here

I want to change the text colour of selected area only like above.

Answer

Kirit Modi picture Kirit Modi · Aug 6, 2014

Add lable in your pickerview in your viewDidLoad method as below.

Define label and myPickerView both in ViewController.h file

- (void)viewDidLoad
{

    myPickerView = [[UIPickerView alloc] initWithFrame:CGRectMake(0, 200, 320, 200)];
    myPickerView.delegate = self;
    myPickerView.showsSelectionIndicator = YES;
    [self.view addSubview:myPickerView];

    label = [[UILabel alloc] initWithFrame:CGRectMake(145, 76, 36, 36)];
    //label.text = @"Label";
    label.font = [UIFont boldSystemFontOfSize:20];
    label.layer.cornerRadius = 18;
    [label setTextColor:[UIColor whiteColor]];
    label.backgroundColor = [UIColor blueColor];
    label.textAlignment = NSTextAlignmentCenter;
    label.shadowColor = [UIColor whiteColor];
    label.shadowOffset = CGSizeMake (0,1);
    [myPickerView addSubview:label];

    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
}

in pickerview delegate set label title.

#pragma mark - PickerView delegate

- (void)pickerView:(UIPickerView *)pickerView didSelectRow: (NSInteger)row inComponent:(NSInteger)component {
    // Handle the selection

    [label setText:[NSString stringWithFormat:@"%d",row]];
    NSLog(@"%@",[NSString stringWithFormat:@"%d",row]);

}
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {

    NSLog(@"%@",[NSString stringWithFormat:@"%d",row]);
    [label setText:[NSString stringWithFormat:@"%d",row]];
    return [NSString stringWithFormat:@"%d",row];
}

Your OuytPut is :

enter image description here