1.搭建界面
1> 注意点:UIPickerView的高度不能改,默认162,PickerView里面每行的高度可以改,不要弄混淆了。
2.UIPickerView
1> 如何使用UIPickerView展示数据?
进入UIPickerView头文件,有数据源和代理,联想到UITableView,模仿UITableView的用法。
2> 让控制器作为PickerView的数据源,控制器遵守PickerView的数据源方法
3> PickerView的数据源方法
1> numberOfComponentsInPickerView: 返回多少列
2> pickerView:numberOfRowsInComponent: 返回第component列有多少行
3> 和UITableView的区别,每一行长什么样,是由PickerView的代理决定的。
4> PickerView的代理方法
(1) 返回第component列第row行长什么样。
第component列第row行的展示标题
- (NSString *)pickerView:(UIPickerView *)pickerViewtitleForRow:(NSInteger)row forComponent:(NSInteger)component
第component列第row行带属性的标题
- (NSAttributedString *)pickerView:(UIPickerView *)pickerView attributedTitleForRow:(NSInteger)row forComponent:(NSInteger)component
第component列第row行展示的视图
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)components usingView:(UIView *)view;
(2) 返回第component列每一行的高度和宽度
- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component;
- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component;
(3) 选中第component列第row行调用
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component;
5>记录当前选中的行号
_proIndex = [pickerView selectedRowInComponent:0];
3.UIPickerView的应用
1、单个PickerView的使用
//PickerView是用来展示数据的组件
#import "ViewController.h"
@interface ViewController ()
//遵循协议
@property (nonatomic,strong)UIPickerView * pickerView;//自定义pickerview
@property (nonatomic,strong)NSArray * letter;//保存要展示的字母
@property (nonatomic,strong)NSArray * number;//保存要展示的数字
@end
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
//获取需要展示的数据
[self loadData];
// 初始化pickerView
self.pickerView = [[UIPickerView alloc]initWithFrame:CGRectMake(0, 50, self.view.bounds.size.width, 200)];
[self.view addSubview:self.pickerView];
//指定数据源和委托
self.pickerView.delegate = self;
self.pickerView.dataSource = self;
}
#pragma mark 加载数据
-(void)loadData
{
//需要展示的数据以数组的形式保存
self.letter = @[@"aaa",@"bbb",@"ccc",@"ddd"];
self.number = @[@"111",@"222",@"333",@"444"];
}
#pragma mark UIPickerView DataSource Method 数据源方法
//指定pickerview有几个表盘
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
return 2;//第一个展示字母、第二个展示数字
}
//指定每个表盘上有几行数据
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{
NSInteger result = 0;
switch (component) {
case 0:
result = self.letter.count;//根据数组的元素个数返回几行数据
break;
case 1:
result = self.number.count;
break;
default:
break;
}
return result;
}
#pragma mark UIPickerView Delegate Method 代理方法
//指定每行如何展示数据（此处和tableview类似）
-(NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
NSString * title = nil;
switch (component) {
case 0:
title = self.letter[row];
break;
case 1:
title = self.number[row];
break;
default:
break;
}
return title;
}
2.两个PickerView联动
coding地址：https://coding.net/u/Panzz/p/UIPickerViewDemo/git
#import "T2ViewController.h"
@interface T2ViewController ()
@property (strong, nonatomic) IBOutlet UIPickerView *pickerView;
@property (nonatomic,strong)NSArray * provinces;//展示省份
@property (nonatomic,strong)NSArray * cities;//展示城市
@property (nonatomic,strong)UILabel * label;
@end
@implementation T2ViewController
- (void)viewDidLoad {
[super viewDidLoad];
[self loadData];
self.pickerView.delegate = self;
self.pickerView.dataSource = self;
}
-(void)loadData{
NSString * path = [[NSBundle mainBundle]pathForResource:@"area" ofType:@"plist"];
self.provinces = [NSArray arrayWithContentsOfFile:path];
self.cities = [NSArray arrayWithArray:self.provinces[0][@"Cities"]];
self.label = [[UILabel alloc]initWithFrame:CGRectZero];
self.label.translatesAutoresizingMaskIntoConstraints = NO;
self.label.backgroundColor = [UIColor groupTableViewBackgroundColor];
self.label.textColor = [UIColor greenColor];
self.label.font = [UIFont systemFontOfSize:30];
[self.label setTextAlignment:NSTextAlignmentCenter];
[self.view addSubview:self.label];
NSArray * labelTop = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[_pickerView]-30-[_label(50)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_pickerView,_label)];
NSArray * labelH = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[_label]-20-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_label)];
[self.view addConstraints:labelTop];
[self.view addConstraints:labelH];
}
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{
return 2;
}
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{
NSInteger rows = 0;
switch (component) {
case 0:
rows = self.provinces.count;
break;
case 1:
rows = self.cities.count;
break;
default:
break;
}
return rows;
}
-(NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{
NSString * title = nil;
switch (component) {
case 0:
title = self.provinces[row][@"State"];
break;
case 1:
title = self.cities[row][@"city"];
break;
default:
break;
}
return title;
}
//选中时回调的委托方法，在此方法中实现省份和城市间的联动
-(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component{
switch (component) {
case 0://选中省份表盘时，根据row的值改变城市数组，刷新城市数组
self.cities = self.provinces[row][@"Cities"];
[self.pickerView reloadComponent:1];
break;
case 1:
// NSLog(@"当前选择目的地为：%@%@",self.provinces[[self.pickerView selectedRowInComponent:0]][@"State"],self.cities[[self.pickerView selectedRowInComponent:1]][@"city"]);
self.label.text = [NSString stringWithFormat:@"%@%@",self.provinces[[self.pickerView selectedRowInComponent:0]][@"State"],self.cities[[self.pickerView selectedRowInComponent:1]][@"city"]];
break;
default:
break;
}
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end
3.自定义pickerview展示数据的方式label
#pragma mark pickerView Method
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
return 1;//表盘数量
}
//判断是哪个pickerview，返回相应的rows
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{
NSInteger rows = 0;
if (pickerView == self.pickerView)
{
rows = self.pickerViewArr.count;
}
else
{
rows = self.pickerViewArr2.count;
}
return rows;
}
//判断是哪个pickerview，返回相应的title
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
NSString *str = nil;
if (pickerView == self.pickerView)
{
str = self.pickerViewArr[row];
}
else
{
str = self.pickerViewArr2[row];
}
return str;
}
#pragma mark 给pickerview设置字体大小和颜色等
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
{
//可以通过自定义label达到自定义pickerview展示数据的方式
UILabel* pickerLabel = (UILabel*)view;
if (!pickerLabel)
{
pickerLabel = [[UILabel alloc] init];
pickerLabel.adjustsFontSizeToFitWidth = YES;
pickerLabel.textAlignment = NSTextAlignmentCenter;
[pickerLabel setBackgroundColor:[UIColor lightGrayColor]];
[pickerLabel setFont:[UIFont boldSystemFontOfSize:15]];
}
pickerLabel.text=[self pickerView:pickerView titleForRow:row forComponent:component];//调用上一个委托方法，获得要展示的title
return pickerLabel;
}
//选中某行后回调的方法，获得选中结果
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
{
if (pickerView == self.pickerView)
{
self.pickerViewSelect = self.pickerViewArr[row];
NSLog(@"selected == %@",self.pickerViewSelect);
}
else
{
self.pickerViewSelect2 = self.pickerViewArr2[row];
}
}
代码地址