iOS UIPickerView的简单使用

UIPickerView控件在给 用户选择某些特定的数据时经常使用到，这里演示一个简单的选择数据，显示在UITextField输入框里，把UIPickerView作为输入 View，用Toolbar作为选定数据的按钮。和其他UITableView控件相似，UIPickerView也需要数据源。

我们要实现的效果如下：

下面开始使用的步骤。

1、打开XCode，新建一个Single View Application ,命名为PickerViewDemo，Company Identifier 为：com.company.program

2、拖放控件

2.1、拖放一个UIPickerView，放置在View的最下方

2.2、拖放一个Toolbar控件，放置在View的外面，让它不属于View的子控件，并把item命名为“完成”，效果如下：

2.3 放置一个Flexible Space Bar Button Item 撑开

2.4  放一个UITextField,用来显示选择的数据

3、创建映射

在ViewController.xib文件里，按住Control键，选择各个控件，拖拽到 ViewController.h文件里，生成以下变量代码

[cpp] view plaincopy

1. #import <UIKit/UIKit.h>
2. @interface ViewController : UIViewController
3. {
4. NSArray *pickerArray;
5. }
6. - (IBAction)selectButton:(id)sender;
7. @property (strong, nonatomic) IBOutlet UIToolbar *doneToolbar;
8. @property (strong, nonatomic) IBOutlet UIPickerView *selectPicker;
9. @property (strong, nonatomic) IBOutlet UITextField *textField;
10. @end

4、实现数据源和协议

ViewController.h文件里实现

<UIPickerViewDelegate, UITextFieldDelegate,UIPickerViewDataSource>

[cpp] view plaincopy

1. #import <UIKit/UIKit.h>
2. @interface ViewController : UIViewController<UIPickerViewDelegate, UITextFieldDelegate,UIPickerViewDataSource>
3. {
4. NSArray *pickerArray;
5. }
6. - (IBAction)selectButton:(id)sender;
7. @property (strong, nonatomic) IBOutlet UIToolbar *doneToolbar;
8. @property (strong, nonatomic) IBOutlet UIPickerView *selectPicker;
9. @property (strong, nonatomic) IBOutlet UITextField *textField;
10. @end

ViewController.m文件

[cpp] view plaincopy

1. -(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{
2. return 1;
3. }
4. -(NSInteger) pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{
5. return [pickerArray count];
6. }
7. -(NSString*) pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{
8. return [pickerArray objectAtIndex:row];
9. }
10. -(void)textFieldDidEndEditing:(UITextField *)textField{
11. NSInteger row = [selectPicker selectedRowInComponent:0];
12. self.textField.text = [pickerArray objectAtIndex:row];
13. }

上面numberOfComponentsInPickerView返回有几个PickerView ，

textFieldDidEndEditing这个在textField结束编辑时，显示PickerView选择中的数据。

Toolbar 的item的完成按钮

[cpp] view plaincopy

1. - (IBAction)selectButton:(id)sender {
2. [textField endEditing:YES];
3. }

5、初始化

[cpp] view plaincopy

1. - (void)viewDidLoad
2. {
3. [super viewDidLoad];
4. pickerArray = [NSArray arrayWithObjects:@"动物",@"植物",@"石头",@"天空", nil];
5. textField.inputView = selectPicker;
6. textField.inputAccessoryView = doneToolbar;
7. textField.delegate = self;
8. selectPicker.delegate = self;
9. selectPicker.dataSource = self;
10. selectPicker.frame = CGRectMake(0, [[UIScreen mainScreen] bounds].size.height-64-216, [[UIScreen mainScreen] bounds].size.width, 216);
11. }

代码解释：

设置委托

textField.delegate =self;

selectPicker.delegate =self;

selectPicker.dataSource =self;

隐藏UIPickerView

selectPicker.frame =CGRectMake(0,[[UIScreen mainScreen] bounds].size.height-64,[[UIScreen mainScreen] bounds].size.width, 216);

运行：