Question

I don’t have any idea how can I create a custom UIPickerView with an image on the side of the text.

I’ve been searching for a method and I just found this:

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

But I don’t know how I can use that.

These are my arrays:
All works perfectly, I just want to put a diferent image in each row, with 10 different colors.
The colors will be the same for the 3 components but different in each row.
like this image. LINK!!!

- (void)viewDidLoad
{
    [super viewDidLoad];

    Colores1 = [[NSMutableArray alloc] init];
    [Colores1 addObject:@"Negro"];
    [Colores1 addObject:@"Marrón"];
    [Colores1 addObject:@"Rojo"];
    [Colores1 addObject:@"Naranja"];
    [Colores1 addObject:@"Amarillo"];
    [Colores1 addObject:@"Verde"];
    [Colores1 addObject:@"Azul"];
    [Colores1 addObject:@"Violeta"];
    [Colores1 addObject:@"Gris"];
    [Colores1 addObject:@"Blanco"];

    Colores2 = [[NSMutableArray alloc] init];
    [Colores2 addObject:@"Negro"];
    [Colores2 addObject:@"Marrón"];
    [Colores2 addObject:@"Rojo"];
    [Colores2 addObject:@"Naranja"];
    [Colores2 addObject:@"Amarillo"];
    [Colores2 addObject:@"Verde"];
    [Colores2 addObject:@"Azul"];
    [Colores2 addObject:@"Violeta"];
    [Colores2 addObject:@"Gris"];
    [Colores2 addObject:@"Blanco"];

    Colores3 = [[NSMutableArray alloc] init];
    [Colores3 addObject:@"Negro"];
    [Colores3 addObject:@"Marrón"];
    [Colores3 addObject:@"Rojo"];
    [Colores3 addObject:@"Naranja"];
    [Colores3 addObject:@"Amarillo"];
    [Colores3 addObject:@"Verde"];
    [Colores3 addObject:@"Azul"];
    [Colores3 addObject:@"Violeta"];
    [Colores3 addObject:@"Gris"];
    [Colores3 addObject:@"Blanco"];
}

this is my uipickerview:

- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
    return 3;
}
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{

    if(component == Primbanda)
        return [Colores1 count];
    if(component == Segubanda)
        return [Colores2 count];
    if (component == tercbanda)
        return [Colores3 count];
    return 0;
}
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
    if(component == Primbanda)
        return [Colores1 objectAtIndex:row];
    if(component == Segubanda)
        return [Colores2 objectAtIndex:row];
    if (component == tercbanda) 
        return [Colores3 objectAtIndex:row];
    return 0;

}
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
{
    NSLog(@"Row is:%d Component is:%d",row,component);

    int a;//entero de componente 1
    int b;//entero de componente 2
    double c;//entero de componente 3
    double resultado;
    int d; //valor de componente 1 y 2
    NSString *a1; //cadena de a y b!

    a = [pickerView selectedRowInComponent:0]; //asigno a las variables segun el numero!! 
    b = [pickerView selectedRowInComponent:1];

    switch ([pickerView selectedRowInComponent:2]) { //asi se le asignan valores propios!
        case 0:
            c=1;
            break;
        case 1:
            c=10;
            break;
        case 2:
            c=100;
            break;
        case 3:
            c=1000;
            break;
        case 4:
            c=10000;
            break;
        case 5:
            c=100000;
            break;
        case 6:
            c=1000000;
            break;
        case 7:
            c=10000000;
            break;
        case 8:
            c=100000000;
            break;
        case 9:
            c=1000000000;
            break;
        default:
            break;
    }
    NSLog(@"El valor de la tercera es ;%f",c);
    a1 = [[NSString alloc]initWithFormat:@"%d%d",a,b]; //junto las variables a y b
    d= [a1 intValue];    //guardo en la variable
    NSLog(@"el valor de C multiplicado es %f",c);

    resultado = d*c; //multiplica ab por el valor de c

    NSLog(@"valor de resistencia es %.0f Ohms",resultado); //awebo! me salio! :D

    labelresultado.text = [[NSString alloc]initWithFormat:@"%.0f",resultado];

}

Answer 1

From the UIPickerViewDelegate docs

pickerView:viewForRow:forComponent:reusingView:

Called by the picker view when it needs the view to use for a given row in a given component.
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
Parameters

pickerView

    An object representing the picker view requesting the data.
row

    A zero-indexed number identifying a row of component. Rows are numbered top-to-bottom.
component

    A zero-indexed number identifying a component of pickerView. Components are numbered left-to-right.
view

    A view object that was previously used for this row, but is now hidden and cached by the picker view.

The important thing here is the view that is returned, which is the view that is used to display the contents for that row on the picker view, and is where you want to add any images you want.

First you have to implement the delegate method, and declare it in your .h like this:

MyClass <UIPickerViewDelegate>

in your .m

myUIPickerObject.delegate = self;

then implement the method like this:

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
{
    UIView *myColorView = [UIView new]; //Set desired frame
    myColorView.backgroundColor = [UIColor redColor]; //Set desired color or add a UIImageView if you want...
    UIImageView *myImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:"myImage.png"]];
    [view addSubview:myImageView];
    [view addSubview:myColorView];

    //Add subview retains view, so OK to release now
    [myImageView release];
    [myColorView release];

    return view;
}

Hope that helps.