Search code examples
xcodeios5uipickerviewbackground-color

Xcode: UIPickerView Change Individual Row Background Color


I have a UIPickerView with 3 components (or columns), and each column has a different amount of rows or items. I need to be able to set the background color for each row. I did some digging and found something that almost works, but not exactly what I need:

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

CGRect imageFrame = CGRectMake(0.0, 0.0, 15, 15);
UIImageView *label = [[[UIImageView alloc] initWithFrame:imageFrame] **autorelease**];

if (row == 0)
{
    label.backgroundColor = [UIColor redColor];
}
if (row == 1)
{
    label.backgroundColor = [UIColor blueColor];
}
if (row == 2)
{
    label.backgroundColor = [UIColor blackColor];
}   
return label;
}

The code above treats every component/column the same, and will assign the same color sequence to each row. So for example:

Column 1 will have: red/blue/black Column 2 will have: red/blue/black Column 3 will have: red/blue/black

I need to be able to use unique color sequences for each column. I do not need each column to have the same sequence of colors as mentioned above. So for example I may have something like the following:

Column 1: red/green/black Column 2: blue/purple/red/yellow Column 3: white/red


Solution

  • If I'm understanding you correctly, you need to switch on component. For example:

    - (UIView *) pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row 
               forComponent:(NSInteger)component reusingView:(UIView *)view {
        CGRect imageFrame = CGRectMake(0.0, 0.0, 15, 15);
        UIImageView *label = [[[UIImageView alloc] initWithFrame:imageFrame] **autorelease**];
    
        switch (component) {
            //I'm using enumeration types for the components because its pretty
            case THIRD_COMPONENT:
                if (row == 0)
                {
                     label.backgroundColor = [UIColor whiteColor];
                }
                if (row == 1)
                {
                     label.backgroundColor = [UIColor redColor];
                } 
                break;
            case SECOND_COMPONENT:
                if (row == 0)
                {
                    label.backgroundColor = [UIColor blueColor];
                } 
                if (row == 1)
                {
                     label.backgroundColor = [UIColor purpleColor];
                }
                if (row == 2)
                {
                     label.backgroundColor = [UIColor redColor];
                }
                if (row == 3)
                {
                     label.backgroundColor = [UIColor yellow];
                }
                break;
            case FIRST_COMPONENT:
                if (row == 0)
                {
                    label.backgroundColor = [UIColor redColor];
                } 
                if (row == 1)
                {
                     label.backgroundColor = [UIColor blueColor];
                }
                if (row == 2)
                {
                     label.backgroundColor = [UIColor blackColor];
                }
                break;
        }
    
        return label;
    } 
    

    Its a little long and unwieldy but give that a shot and see if it fixes your problem. I might suggest storing the labels with their backgroundColor already set in an array for each component. That way instead of having all of those if statements your new switch statement would look like:

    switch (component) {
        case THIRD_COMPONENT:
            label = [thirdBandColorsArray objectAtIndex:row];
            break;
        case SECOND_COMPONENT:
            label = [secondBandColorsArray objectAtIndex:row];
            break;
        case FIRST_COMPONENT:
            label = [firstBandColorsArray objectAtIndex:row];
            break;
    }
    

    I had to do something similar to what you're describing in one of my apps and that was how I did it. Like I said though, thats just a suggestion. Hope this helps.