簡介
- UIPickerView 是一個選擇器控件， 它可以生成單列的選擇器，也可生成多列的選擇器，而且開發(fā)者完全可以自定義選擇項的外觀庄撮，因此用法非常靈活。 UIPickerView 直接繼承了 UIView 毙籽，沒有繼承 UIControl 洞斯，因此，它不能像 UIControl 那樣綁定事件處理方法坑赡， UIPickerView 的事件處理由其委托對象完成烙如。
- 蘋果官方解釋：
The UIPickerView class implements objects, called picker views, that use a spinning-wheel or slot-machine metaphor to show one or more sets of values. Users select values by rotating the wheels so that the desired row of values aligns with a selection indicator.
初始化
- (instancetype)initWithFrame:(CGRect)frame;
常用屬性
- dataSource：設置數(shù)據(jù)源
- delegate：設置代理
- showsSelectionIndicator：該屬性控制是否顯示UIPickerView中的選中標記（以高亮背景作為選中標記）。
- numberOfComponents： 獲取UIPickerView指定列中包含的列表項的數(shù)量毅否。該屬性是一個只讀屬性亚铁。
常用方法
// 1、刷新所有列 - (void)reloadAllComponents;
// 2螟加、刷新指定列 - (void)reloadComponent:(NSInteger)component;
UIPickerViewDataSource
- 數(shù)據(jù)源徘溢，UIPickerViewDataSource為一個協(xié)議，該協(xié)議提供了如下方法配置UIPickerView的列數(shù)與行數(shù)仰迁。
// 1甸昏、設置列數(shù)
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView;
// 2顽分、設置行數(shù)
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component;
UIPickerViewDelegate
- 代理徐许，同樣的，UIPickerViewDelegate也為一個協(xié)議卒蘸，該協(xié)議可監(jiān)聽用戶交互雌隅，選中某行數(shù)據(jù)，亦可配置UIPickerView的行高及列寬等缸沃。
// 1恰起、設置列寬
- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component;
// 2、設置行高
- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component;
// 3趾牧、設置每行顯示標題
- (nullable NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component;
// 4检盼、自定義行視圖
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(nullable UIView *)view;
// 5、選擇某行
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component;
效果展示
20160119210749628.gif
代碼實現(xiàn)
- 案例分析：從上面效果當點擊北京所在的視圖的時候翘单，從屏幕下方彈出了拾取視圖吨枉，是不是有點熟悉呢蹦渣？沒錯，這似乎類似于文本輸入框貌亭，當文本輸入框在響應用戶交互的時候柬唯，對應的鍵盤會彈起。那我們就按照這樣的思路去實現(xiàn)上述效果圃庭。首先锄奢，我們需自定義鍵盤，通過設置文本輸入框的inputView屬性剧腻，將其設值為pickerView即可拘央，那么【確定】按鈕又如何實現(xiàn)呢？其實很簡單书在，對應的我們可設置文本輸入框的附件視圖屬性inputAccessoryView堪滨，解決了這個問題之后，可能還有疑問蕊温，那就是文本輸入框的光標如何解決呢袱箱？不用擔心，我們可設置文本輸入框的tintColor屬性义矛，設值為透明色clearColor即可发笔。解決了幾個主要的問題，那么要實現(xiàn)上述效果就變得簡單了凉翻，下面我將直接貼上源碼了讨，供各位參考，不到之處制轰，還望指點前计。
#import "ViewController.h"
#define RGB_COLOR(_R,_G,_B,_A) [UIColor colorWithRed:_R/255.0 green:_G/255.0 blue:_B/255.0 alpha:_A]
@interface ViewController () <UIPickerViewDelegate, UIPickerViewDataSource>
{
NSArray *_dataSource; /**< 數(shù)據(jù)源 */ NSInteger _index;
}
@property (nonatomic, strong) UIPickerView *pickerView;/**< 拾取器 */
@property (nonatomic, strong) UITextField *textField; /**< 文本輸入框 */
- (void)initializeDataSource; /**< 初始化數(shù)據(jù)源 */
- (void)initializeUserInterface; /**< 初始化用戶界面 */
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
[self initializeDataSource];
[self initializeUserInterface];
}
#pragma mark *** Initialize methods ***
- (void)initializeDataSource {
// 初始化數(shù)據(jù)源
_dataSource = @[@"北京", @"上海", @"成都", @"上海", @"深圳"];
}
- (void)initializeUserInterface {
// 文本標簽
UILabel *titleLabel = [[UILabel alloc] init];
titleLabel.bounds = CGRectMake(0, 0, 60, 30);
titleLabel.center = CGPointMake(80, 200);
titleLabel.text = @"城市:";
titleLabel.font = [UIFont boldSystemFontOfSize:25];
[self.view addSubview:titleLabel];
// 加載文本輸入框
[self.view addSubview:self.textField];
// 自定義鍵盤樣式
self.textField.inputView = self.pickerView;
UIButton *sureButton = [[UIButton alloc] init];
sureButton.bounds = CGRectMake(0, 0, CGRectGetWidth(self.view.bounds), 30);
sureButton.center = CGPointMake(CGRectGetMidX(self.view.bounds), 25);
sureButton.backgroundColor = RGB_COLOR(231, 231, 231, 1);
// 設置標題對齊方式請1
sureButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;
[sureButton setTitle:@"【確 定】" forState:UIControlStateNormal];
[sureButton setTitleColor:[UIColor blueColor] forState:UIControlStateNormal];
[sureButton setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];
[sureButton addTarget:self action:@selector(respondsToSureButton:) forControlEvents:UIControlEventTouchUpInside];
// 自定義鍵盤附件視圖
_textField.inputAccessoryView = sureButton;
}
#pragma mark *** Events ***
- (void)respondsToSureButton:(UIButton *)sender {
// 收起鍵盤，失去第一響應
[_textField resignFirstResponder];
_textField.text = _dataSource[_index];
}
#pragma mark *** <UIPickerViewDelegate, UIPickerViewDataSource> ***
// 設置列
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
return 1;
}
// 設置行
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
return _dataSource.count;
}
// 設置標題
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
return _dataSource[row];
}
// 點擊某行
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
_index = row;
}
// 自定義行
/*
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view {
return nil;
}
*/
#pragma mark *** Touches ***
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
[self.view endEditing:YES];
}
#pragma mark *** Getters ***
- (UITextField *)textField {
if (!_textField) {
// 文本輸入框
_textField = [[UITextField alloc] init];
_textField.bounds = CGRectMake(0, 0, 220, 30);
_textField.center = CGPointMake(220, 200);
_textField.borderStyle = UITextBorderStyleBezel;
_textField.textAlignment = NSTextAlignmentCenter;
// 修改光標顏色
_textField.tintColor = [UIColor clearColor];
_textField.text = @"北京";
}
return _textField;
}
- (UIPickerView *)pickerView {
if (!_pickerView) {
_pickerView = [[UIPickerView alloc] initWithFrame:CGRectMake(0, 0, 300, 220)];
_pickerView.backgroundColor = RGB_COLOR(244, 244, 244, 1);
// 設置代理
_pickerView.delegate = self;
// 設置數(shù)據(jù)源
_pickerView.dataSource = self;
_pickerView.showsSelectionIndicator = YES;
}
return _pickerView;
}
@end
