iOS學習之UIPickerView控制項的簡單使用

UIPickerView控制項在給使用者選擇某些特定的資料時經常使用到，這裡示範一個簡單的選擇資料，顯示在UITextField輸入框裡，把UIPickerView作為輸入View，用Toolbar作為選定資料的按鈕。和其他UITableView控制項相似，UIPickerView也需要資料來源。

我們要實現的效果如下：

下面開始使用的步驟。

1、開啟XCode 4.3.2，建立一個Single View Application ,命名為PickerViewDemo，Company Identifier 為：com.rongfzh.yc2、拖放控制項

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

2.2、拖放一個Toolbar控制項，放置在View的外面，讓它不屬於View的子控制項，並把item命名為“完成”，效果如下：

 

2.3 放置一個Flexible Space Bar Button Item 撐開 

 

2.4  放一個UITextField,用來顯示選擇的資料

 

3、建立映射

在ViewController.xib檔案裡按 alt + command+ enter鍵，開啟Assistant Editor，按住Control鍵，選擇各個控制項，拖拽到 ViewController.h檔案裡，產生以下變數代碼

 

#import <UIKit/UIKit.h>@interface ViewController : UIViewController{    NSArray *pickerArray;}- (IBAction)selectButton:(id)sender;@property (strong, nonatomic) IBOutlet UIToolbar *doneToolbar;@property (strong, nonatomic) IBOutlet UIPickerView *selectPicker;@property (strong, nonatomic) IBOutlet UITextField *textField;@end

 

4、實現資料來源和協議

ViewController.h檔案裡實現

<UIPickerViewDelegate, UITextFieldDelegate,UIPickerViewDataSource>

 

 

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

ViewController.m檔案

-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{    return 1;}-(NSInteger) pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{    return [pickerArray count];}-(NSString*) pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{    return [pickerArray objectAtIndex:row];}-(void)textFieldDidEndEditing:(UITextField *)textField{    NSInteger row = [selectPicker selectedRowInComponent:0];    self.textField.text = [pickerArray objectAtIndex:row];}

 

上面numberOfComponentsInPickerView返回有幾個PickerView ，

textFieldDidEndEditing這個在textField結束編輯時，顯示PickerView選擇中的資料。

 

Toolbar 的item的完成按鈕

 

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

 

 

5、初始化

 

 

- (void)viewDidLoad{    [super viewDidLoad];    pickerArray = [NSArray arrayWithObjects:@"動物",@"植物",@"石頭",@"天空", nil];    textField.inputView = selectPicker;    textField.inputAccessoryView = doneToolbar;    textField.delegate = self;    selectPicker.delegate = self;    selectPicker.dataSource = self;    selectPicker.frame = CGRectMake(0, 480, 320, 216);}

 

代碼解釋：

設定委託

   textField.delegate =self;

    selectPicker.delegate =self;

    selectPicker.dataSource =self;

 

隱藏UIPickerView

    selectPicker.frame =CGRectMake(0,480,320, 216);

運行：

 

例子代碼：http://download.csdn.net/detail/totogo2010/4391870 

https://github.com/schelling/YcDemo

著作權聲明：本文由http://blog.csdn.net/totogo2010/原創，歡迎轉載分享。請尊重作者勞動，轉載時保留該聲明和作者部落格連結，謝謝