第二十九篇：UIPickerView简述与代码练习

一.UIPickerView

1.UIPickerView的常见属性

// 数据源(用来告诉UIPickerView有多少列多少行)

@property(nonatomic,assign)id<UIPickerViewDataSource> dataSource;

// 代理(用来告诉UIPickerView每1列的每1行显示什么内容,监听UIPickerView的选择)

@property(nonatomic,assign)id<UIPickerViewDelegate>   delegate;

// 是否要显示选中的指示器

@property(nonatomic)       BOOL                       showsSelectionIndicator;

// 一共有多少列

@property(nonatomic,readonly) NSInteger numberOfComponents;

2.UIPickerView的常见方法

// 重新刷新所有列

- (void)reloadAllComponents;

// 重新刷新第component列

- (void)reloadComponent:(NSInteger)component;

// 主动选中第component列的第row行

- (void)selectRow:(NSInteger)row inComponent:(NSInteger)component animated:(BOOL)animated;

// 获得第component列的当前选中的行号

- (NSInteger)selectedRowInComponent:(NSInteger)component;

3.数据源方法(UIPickerViewDataSource)

//  一共有多少列

- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView;

//  第component列一共有多少行

- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component;

4.代理方法(UIPickerViewDelegate)

//  第component列的宽度是多少

- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component;

//  第component列的行高是多少

- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component;

//  第component列第row行显示什么文字

- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component;

//  第component列第row行显示怎样的view(内容)

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view;

//  选中了pickerView的第component列第row行

- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component;

二.UIDatePicker

1.常见属性

// datePicker的显示模式

@property (nonatomic) UIDatePickerMode datePickerMode;

// 显示的区域语言

@property (nonatomic,retain) NSLocale   *locale;

2.监听UIDatePicker的选择

* 因为UIDatePicker继承自UIControl,所以通过addTarget:...监听

代码1---菜单选择：

效果图：

//
//  ViewController.m
//  12-01UIPickerView
//
//  Created by 瞿杰 on 15/10/6.
//  Copyright © 2015年 itcast. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()<UIPickerViewDataSource , UIPickerViewDelegate>

- (IBAction)randomAction;

@property (weak, nonatomic) IBOutlet UIPickerView *pickerView;
@property (weak, nonatomic) IBOutlet UILabel *fruitLabel;
@property (weak, nonatomic) IBOutlet UILabel *mainLabel;
@property (weak, nonatomic) IBOutlet UILabel *drinkLabel;

@property (strong, nonatomic)NSArray * foods;

@end

@implementation ViewController

- (NSArray *)foods{
    if (_foods == nil) {
        _foods = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"foods.plist" ofType:nil]];
    }
    return _foods ;
}

- (void)viewDidLoad {
    [super viewDidLoad];

    // 设置pickerView的数据源与代理
    self.pickerView.dataSource = self;
    self.pickerView.delegate = self;
    // 初始化数据
    for (int i = 0; i < self.foods.count; i++) {
        [self pickerView:self.pickerView didSelectRow:0 inComponent:i];
    }
}
/** 当随机按妞被点击时调用 */
- (IBAction)randomAction {
    
    for (int component = 0; component < self.foods.count; component++) {
        long  count = [self.foods[component] count];
        int preRow = [self.pickerView selectedRowInComponent:component];
        int row = rand()% count;
        while (row == preRow) {
            row = rand() % count;
        }
        // 主动更改第component列显示选中第row行
        [self.pickerView selectRow:row inComponent:component animated:YES];
        
        [self pickerView:self.pickerView didSelectRow:row inComponent:component];
    }
}

#pragma mark - pickerView的数据源方法
/** 设置列数 */
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{
    return self.foods.count;
}
/** 设置第component列的行数 */
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{
    return [self.foods[component] count];
}

#pragma mark - pickerView的代理方法
/** 设置第component列第row行的内容 */
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{
    return [self.foods[component] objectAtIndex:row];
}

/** 设置第component列的宽度 */
//- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component{
//    return 100;
//}
/** 设置第component列每行的高度 */
- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component{
    return 60;
}
/** 选中第component列的第row行时，主动调用该方法 */
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component{
    if (component == 0) {
        self.fruitLabel.text = [self.foods[component] objectAtIndex:row];
    }
    else if (component == 1){
        self.mainLabel.text = [self.foods[component] objectAtIndex:row];
    }
    else {
        self.drinkLabel.text = [self.foods[component] objectAtIndex:row];
    }
}


@end

代码2---选择城市：

效果图：

//
//  QJCite.h
//  12-02城市选择
//
//  Created by 瞿杰 on 15/10/6.
//  Copyright © 2015年 itcast. All rights reserved.
//

#import <Foundation/Foundation.h>

@interface QJCitie : NSObject

@property (nonatomic, strong)NSArray * cities;
@property (nonatomic, copy)NSString * name;

+ (instancetype)citieWithDictionary:(NSDictionary *)dic;
- (instancetype)initWithDictionary:(NSDictionary *)dic;

@end

//
//  QJCite.m
//  12-02城市选择
//
//  Created by 瞿杰 on 15/10/6.
//  Copyright © 2015年 itcast. All rights reserved.
//

#import "QJCitie.h"

@implementation QJCitie

+ (instancetype)citieWithDictionary:(NSDictionary *)dic{
    return [[self alloc] initWithDictionary:dic];
}
- (instancetype)initWithDictionary:(NSDictionary *)dic{
    self.name = dic[@"name"];
    self.cities = dic[@"cities"];
    return self;
}

@end

//
//  ViewController.m
//  12-02城市选择
//
//  Created by 瞿杰 on 15/10/6.
//  Copyright © 2015年 itcast. All rights reserved.
//

#import "ViewController.h"
#import "QJCitie.h"

@interface ViewController ()<UIPickerViewDataSource , UIPickerViewDelegate>

@property (nonatomic, weak)UIPickerView * pickerView;
@property (nonatomic, strong)NSArray * cities;
@property (nonatomic, weak)UILabel * label;

- (UIPickerView *)creatPickerView;


@end

@implementation ViewController


- (void)viewDidLoad {
    [super viewDidLoad];
    
    // 1.创建一个pickerView
    self.pickerView = [self creatPickerView];
    // 设置数据源与代理
    self.pickerView.dataSource = self;
    self.pickerView.delegate = self;
    
    // 2.添加一个UILabel
    UILabel * label = [[UILabel alloc]init];
    label.frame = CGRectMake(0, 400, self.view.frame.size.width, 60);
    label.textAlignment = NSTextAlignmentCenter;
    [self.view addSubview:label];
    self.label = label;
    // 设置数据
    [self pickerView:self.pickerView didSelectRow:0 inComponent:0];
    
}
/** 初始化数据 */
- (NSArray *)cities{
    if (_cities == nil) {
        NSArray * citiesArray = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"cities" ofType:@"plist" ]];
        NSMutableArray * cities = [NSMutableArray array];
        for (NSDictionary * dic in citiesArray){
            QJCitie * citie = [QJCitie citieWithDictionary:dic];
            [cities addObject:citie];
        }
        _cities = cities;
    }
    return _cities;
}

/** 创建一个pickerView 并添加到视图中 */
- (UIPickerView *)creatPickerView{
    // 创建
    UIPickerView * pickerView = [[UIPickerView alloc]init];
    pickerView.showsSelectionIndicator = YES;
    // 设置frame
    CGFloat  X = 0;
    CGFloat  Y = 200;
    CGFloat  W = self.view.frame.size.width;
    CGFloat  H = 200;
    pickerView.frame = CGRectMake(X, Y, W, H);
    // 添加到视图
    [self.view addSubview:pickerView];
    // 返回
    return pickerView;
}

#pragma mark - pickerView数据源方法
/** 设置列数 */
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{
    return 2;
}
/** 设置第component列的行数 */
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{
    if (component ==0) {
        return self.cities.count;
    }
    else{// 第2列
        // 先跟据第1列选了第row0行的省份，来确定第component列有多少行
        long row0 = [self.pickerView selectedRowInComponent:0];
        QJCitie * citie = self.cities[row0];
        return citie.cities.count;
    }
}

#pragma mark - pickerView代理方法
/** 设置第component列第row行的内容 */
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{
    
    QJCitie * citie ;
    if (component == 0) {
        citie = self.cities[row];
        return citie.name;
    }
    else{
       long row0 = [self.pickerView selectedRowInComponent:0];
        citie = self.cities[row0];
        return citie.cities[row];
    }
}

/** 设置第component列每行的高度 */
- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component{
    return 60;
}

/** 当拖动第component列第row行时，自动调用，设置label的数据 */
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component{
    if (component == 0) {
        // 重新加载第1列
        [self.pickerView reloadComponent:1];
        [self pickerView:self.pickerView didSelectRow:[self.pickerView selectedRowInComponent:1] inComponent:1];
    }
    else{
        long row0 = [self.pickerView selectedRowInComponent:0];
        QJCitie * citie = self.cities[row0];
        self.label.text = [NSString stringWithFormat:@"%@  %@",citie.name,citie.cities[row]];
    }
}

@end