iphone - How to use one UIPickerView for multiple textfields in one view?

Question

I have 8 textfields in one view. I want to populate each using a pickerview. Can I have 1 pickerview which will display different list of items from different arrays for different textfields?

Can someone explain how do I do it programmatically with a sample code?

Also how can I hide the pickerview when the view loads and it should be displayed only when I click on a textfield with its corresponding data list? It should disappear when I select the data and reappear when I click on a different textfield with its corresponding data list and so on.

I am new to xcode. Any help will be much appreciated. Thank you.

Answer 1

You can use only one PickerView that shows different data depending on some conditions.

My idea is the following: you could create, lets say, 8 different arrays - one for populating the UIPickerView depending on what UITextField was tapped. Declare them in the interface as NSArray and initialize in viewDidLoad:

array1st = ...
array2nd = ...
array3d = ...
//and until 8.

Then you create another just to point the array that should fill it (like NSArray *currentArray) and you don't even need to init it = it will be used only for pointing the correct array.

So you should set the delegate of the UITextFields to your view controller, and in the method textFieldShouldBeginEditing you check who is the UITextField, assign the correct array as the currentArray, reload the UIPickerView with reloadData, and return NO in the same textFieldShouldBeginEditing method. currentTextField is a pointer only to know what is the currentUITextField being "edited" - we need to store it to be able to set the text after selecting data in the picker. Declare currentTextField in the interface.

- (BOOL)textFieldShouldBeginEditing:(UITextField *)textField
{
    currentTextField = textField;
    if (textField == myFirstTextView)
    {
        currentArray = array1st;
        [pickerView reloadData];
        [self animatePickerViewIn];
        return NO;
    }
    //and this way until 8th
}

So, when your view controller, that in fact is the UIPickerViewDelegate, you populate your UIPickerView according to the current array and you don't need to change anything, just use the currentArray as the array to get data from.

Now, to show the pickerView:

After connecting the IBOutlet, in your viewDidLoad you should do two things: set the frame of the UIPickerView and add it as a subview:

pickerView.frame = CGRectMake(0,self.view.frame.size.height, pickerView.frame.size.width, pickerView.frame.size.height);
pickerView.delegate = self;
pickerView.dataSource = self;
//or you can do it via Interface Builder, right click the pickerView and then connect delegate and dataSource to the file's owner
[self.view addSubview:pickerView];

Now you need to create the method called animatePickerViewIn, that we called when the user taps the UITextField.

-(void)animatePickerViewIn
{

    [UIView animateWithDuration:0.25 animations:^{
        [pickerView setFrame:CGRectMake(0, pickerView.frame.origin.y-pickerView.frame.size.height, pickerView.frame.size.width, pickerView.frame.size.height)];
    }];
}

To load the data in the pickerView:

-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{

    return [currentArray count];
}


-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
    return 1;
}

-(NSString*)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
    return [currentArray objectAtIndex:row];
}

And when the user selects the row in the pickerView, you will receive it as a delegate method. So just set the text of the currentTextField as the value selected:

-(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
{
    //and here you can do in two ways:
    //1
    [currentTextField setText:[currentArray objectAtIndex:row]];
    //2
    [currentTextField setText:[self pickerView:pickerView titleForRow:row inComponent:component]];
}