UIPickerView

目录：
1、单个PickerView的使用
2、两个PickerView联动
3、PickerView标题显示自定义

1.单个pickerview的使用

coding地址：https://coding.net/u/Panzz/p/UIPickerViewDemo/git

//PickerView是用来展示数据的组件

#import "ViewController.h"

@interface ViewController ()<UIPickerViewDataSource,UIPickerViewDelegate>
//遵循协议
@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;
}

简单的pickerview效果图（两个pickerview不联动）

2.两个PickerView联动

coding地址：https://coding.net/u/Panzz/p/UIPickerViewDemo/git

@interface T2ViewController ()<UIPickerViewDataSource,UIPickerViewDelegate>//遵循协议
@property (strong, nonatomic) IBOutlet UIPickerView *pickerView;

//storyboard中拖拽
@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"]];
   
   //label的布局约束
    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];
}

//有几个表盘（component）
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
    return 2;
}

//没个表盘有几行数据（rows）
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{
    NSInteger rows = 0;
    switch (component) {
        case 0:
            rows = self.provinces.count;//根据plist文件中的数据返回rows
            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:
            self.label.text = [NSString stringWithFormat:@"%@%@",self.provinces[[self.pickerView selectedRowInComponent:0]][@"State"],self.cities[[self.pickerView selectedRowInComponent:1]][@"city"]];//如果选中第二个
            break;
            
        default:
            break;
    }
}

实现省市之间联动

3.设置PickerView展示的title样式

下面介绍自定义pickerview展示的label方法
（自定义pickerview展示数据的方式label）

通过自定义返回的label达到自定义pickerview行数据展示方式

#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];
    }
}

UIPickerView

推荐阅读更多精彩内容