How to implement a Multicomponent Picker in Iphone?

This is the example of a Picker with two components or wheels, and each wheel will be independent of the other wheel. The left wheel will have a list of sandwich fillings, and the right wheel will have a selection of bread types.

 This is the example of a Picker with two components or wheels, and each wheel will be independent of the other wheel. The left wheel will have a list of sandwich fillings, and the right wheel will have a selection of bread types.

Step 1: Create a new project from Xcode and select view-base application template.

Step 2: Adding the following code to the controller Header file.

#import <UIKit/UIKit.h>
#define kFillingComponent  0
#define kBreadComponent  1

@interface DoubleComponentPickerViewController : UIViewController
 <UIPickerViewDelegate, UIPickerViewDataSource>{
         IBOutlet UIPickerView *doublePicker;
         NSArray *fillingTypes;
         NSArray *breadTypes;
}

@property (nonatomic,retain)  UIPickerView *doublePicker;
@property (nonatomic,retain)  NSArray *fillingTypes;
@property (nonatomic,retain)  NSArray *breadTypes;

-(IBAction)buttonPressed;

Step 3: Double click .xib file to open the file in Interface Builder. Add a picker and abutton to te View, and  then make the necessary connections. First, connect the doublePicker outlet on File’s Owner to the picker. Second, connect the DataSource and Delegate connections on the picker view to File’s Owner. Third, connect the Touch Up Inside event of the button to the buttonPressed action on File’s Owner. Now close your nib file and go back to Xcode.

Step 4: We need to add following code to our controller file. The buttonPressed method used when we request the selected row using those constants , kBreadComponent and kFillingComponent. There is a another method viewDidLoad: , we are just creating  arrays from a hard loadinglist of strings.

-(IBAction)buttonPressed
{
        NSInteger breadRow = [doublePicker selectedRowInComponent:
                              kBreadComponent];
        NSInteger fillingRow = [doublePicker selectedRowInComponent:
                                kFillingComponent];
        NSString *bread = [breadTypes objectAtIndex:breadRow];
        NSString *filling = [fillingTypes objectAtIndex:fillingRow];
       
        NSString *message = [[NSString alloc] initWithFormat:
         @"Your %@ on %@ bread will be right up.",filling, bread];
       
        UIAlertView *alert = [[ UIAlertView alloc] initWithTitle:
                     @"Thank you for your order"
                 message:message
                 delegate:nil
                 cancleButtonTitle:@"Great!"
                                 otherButtonTitles:nil];
        [alert show];
        [alert release];
        [message release];
}

- (void)viewDidLoad {
        NSArray *breadArray = [[NSArray alloc] initWithObjects:
        @"White",@"Whole Wheat",@"Rye",@"Sourdough",@"Seven Grain", nil];
        self.breadTypes = breadArray;
        [breadArray release];
       
        NSArray *fillingArray = [[NSArray alloc] initWithObjects:
        @"Turkey",@"Peanut Butter",@"Tuna Salad",@"Chicken Salad",@"Roast Beef",
          @"Vegemite",nil];
        self.fillingTypes = fillingArray;
        [fillingArray release];
        [super viewDidLoad];
}

-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
  {
        return 2;
  }
 
 -(NSInteger)pickerView:(UIPickerView *)pickerView
   numberOfRowsInComponent:(NSInteger)component
  {
        if (component == kBreadComponent)
                return[self.breadTypes count];
                return[self.fillingTypes count];
  }

 -(NSString *)pickerView:(UIPickerView *)pickerView
  titleForRow:(NSInteger)row
        forComponent:(NSInteger)component
  {
        if (component == kBreadComponent)
        return [self. breadTypes objectAtIndex:row];
        return [self.fillingTypes objectAtIndex:row];
  }

Step 5: Now compile and run your application on simulator.(See figure 1)

Figure 1: Multicomponent Picker View.

You can downloaded SourceCode from here DoubleComponentPicker 2

WP Greet Box icon
Hello there! If you are new here, you might want to subscribe to the RSS feed for updates on this topic, and free programming tips and tricks and source code            snippets.

6 Responses to “How to implement a Multicomponent Picker in Iphone?”

  1. JB says:

    Nice tutorial. Do you know how to make a Picker with two components or wheels, and one wheel will be dependent on the other wheel? Or do you know of an example?

  2. JB says:

    Great tutorial. Do you know how to make a Picker with two components or wheels, and one wheel will be dependent on the other wheel?

  3. Sushant says:

    This is the example of Picker with two components or wheels. I think this example will help you.

  4. Bob Schoenburg says:

    Great. Saved me a lot of time trying to figure out how to do this. My picker has 3 wheels!

  5. Donito says:

    How can I set a multi select picker with checkmarks. Like this :
    http://www.imageurlhost.com/images/aqqoszg8839e707dwy6u.png

    Please, help

Leave a Reply

Security Code:

learn iphone programming

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Our Mobile Training Courses

EDUmobile.ORG offers the following 4 Mobile Training Courses. Our iPhone Training Course is very popular, with over 200 developers in training.

learn iphone programming
© 2010 EDUmobile.ORG