码迷,mamicode.com
首页 > 移动开发 > 详细

iOS UIPickerView的简单使用

时间:2015-06-11 16:11:50      阅读:152      评论:0      收藏:0      [点我收藏+]

标签:

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文件里,生成以下变量代码

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

技术分享

4、实现数据源和协议

ViewController.h文件里实现

<UIPickerViewDelegate, UITextFieldDelegate,UIPickerViewDataSource>

 

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


ViewController.m文件

  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.   
  11. -(void)textFieldDidEndEditing:(UITextField *)textField{  
  12.     NSInteger row = [selectPicker selectedRowInComponent:0];  
  13.     self.textField.text = [pickerArray objectAtIndex:row];  
  14. }  

上面numberOfComponentsInPickerView返回有几个PickerView ,

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

 

Toolbar 的item的完成按钮

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

 

5、初始化

  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.   
  12. }  

代码解释:

设置委托

   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);

运行:技术分享

iOS UIPickerView的简单使用

标签:

原文地址:http://www.cnblogs.com/huangzs/p/4568973.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!