iOS边练边学--UIPickerView和UIDatePicker的简单使用

一、点菜系统练习（UIPickerView）

<1>UIPickerView的常用代理方法介绍

 #pragma mark - <UIPickerViewDelegate>

 // 返回指定列的行宽度
 - (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component
 {

 }
 // 返回指定列中行的高度
 - (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component
 {

 }

 // 返回第component列的第row行的字符串
 - (nullable NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
 {

 }
 // 富文本属性，可以描述文字的大小和颜色
 - (nullable NSAttributedString *)pickerView:(UIPickerView *)pickerView attributedTitleForRow:(NSInteger)row forComponent:(NSInteger)component
 {

 }
 // 返回一个UIView 第component列第row行
 - (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(nullable UIView *)view
 {

 }
 // 人为选择第component列第row行之后执行的代码
 - (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
 {

 }

<2>UIPickerView必须实现的两个数据源方法

 #pragma mark - <UIPickerViewDataSource>

 // 告诉pickView有多少列
 - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
 {
     return self.foods.count;
 }

 // 告诉pickView的component列中有多少行
 - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
 {
     return [self.foods[component] count];
 }

<3>练习代码

 #import "ViewController.h"

 @interface ViewController () <UIPickerViewDataSource,UIPickerViewDelegate>
 @property (weak, nonatomic) IBOutlet UIPickerView *pickView;
 /** 数据集合 */
 @property(nonatomic,strong) NSArray *foods;
 @property (weak, nonatomic) IBOutlet UILabel *fruitLabel;
 @property (weak, nonatomic) IBOutlet UILabel *mainLabel;
 @property (weak, nonatomic) IBOutlet UILabel *drinkLabel;

 @end

 @implementation ViewController

 - (void)viewDidLoad {
     [super viewDidLoad];
     for (int i = ; i < self.foods.count; i++) {
         [self pickerView:self.pickView didSelectRow: inComponent:i];
     }

 }
 // 随机
 - (IBAction)random:(id)sender {
     for (int i = ; i <self.foods.count; i++) {
         int r = arc4random_uniform((int)[self.foods[i] count]);
         [self.pickView selectRow:r inComponent:i animated:YES];
         [self pickerView:self.pickView didSelectRow:r inComponent:i];
     }
 }

 // 懒加载数据
 - (NSArray *)foods
 {
     if (_foods == nil) {
         NSString *path = [[NSBundle mainBundle] pathForResource:@"foods.plist" ofType:nil];
         _foods = [NSArray arrayWithContentsOfFile:path];
     }
     return _foods;
 }

 #pragma mark - <UIPickerViewDataSource>

 // 告诉pickView有多少列
 - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
 {
     return self.foods.count;
 }

 // 告诉pickView的component列中有多少行
 - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
 {
     return [self.foods[component] count];
 }

 #pragma mark - <UIPickerViewDelegate>

 // 返回指定列中行的高度
 - (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component
 {
     return ;
 }

 // 返回第component列的第row行的字符串
 - (nullable NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
 {
     return self.foods[component][row];
 }

 // 人为选择第component列第row行之后执行的代码
 - (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
 {
     switch (component) {
         case :
             self.fruitLabel.text = self.foods[component][row];
             break;
         case :
             self.mainLabel.text = self.foods[component][row];
             break;
         case :
             self.drinkLabel.text = self.foods[component][row];
             break;
     }
 }

 @end

二、国旗选择练习（pickerView每行都是返回一个自定义控件）

 //
 //  ViewController.m
 //  0322国旗选择
 //
 //  Created by admin on 16/3/22.
 //  Copyright © 2016年 admin. All rights reserved.
 //

 #import "ViewController.h"
 #import "ChaosFlag.h"
 #import "ChaosFlagView.h"

 @interface ViewController () <UIPickerViewDataSource,UIPickerViewDelegate>
 /** 数据模型集合 */
 @property(nonatomic,strong) NSMutableArray *flags;
 @property (weak, nonatomic) IBOutlet UIPickerView *pickView;

 @end

 @implementation ViewController

 - (void)viewDidLoad {
     [super viewDidLoad];
     _pickView.delegate = self;
     _pickView.dataSource = self;
 }
 - (NSMutableArray *)flags
 {
     if (_flags == nil) {
         NSString *path = [[NSBundle mainBundle] pathForResource:@"flags.plist" ofType:nil];
         NSArray *dicArray = [NSArray arrayWithContentsOfFile:path];
         NSMutableArray *arr = [NSMutableArray array];
         for (NSDictionary *dict in dicArray) {
             ChaosFlag *flag = [ChaosFlag flagWithDict:dict];
             [arr addObject:flag];
         }
         _flags = arr;
     }
     return _flags;
 }

 #pragma mark - <UIPickerViewDataSource>
 - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
 {
     return self.flags.count;
 }

 - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
 {
     return ;
 }

 #pragma mark - 代理方法
 - (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
 {
     // 加载xib
     ChaosFlagView *flagView = [[NSBundle mainBundle] loadNibNamed:@"ChaosFlagView" owner:nil options:nil][];
     ChaosFlag *flag = self.flags[row];
     flagView.flag = flag;
     return flagView;
 }
 - (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component
 {
     return ;
 }
 @end

三、生日选择，省市二级联动

 //
 //  ViewController.m
 //  0323-生日城市选择器
 //
 //  Created by admin on 16/3/23.
 //  Copyright © 2016年 admin. All rights reserved.
 //

 #import "ViewController.h"
 #import "ChaosProvince.h"

 @interface ViewController () <UITextFieldDelegate,UIPickerViewDataSource,UIPickerViewDelegate>
 @property (weak, nonatomic) IBOutlet UITextField *birthdayLabel;
 @property (weak, nonatomic) IBOutlet UITextField *cityLabel;

 /** 数据集合 */
 @property(nonatomic,strong) NSMutableArray *provinces;

 /** datePicker */
 @property(nonatomic,strong) UIDatePicker *datePicker;
 /** pickView */
 @property(nonatomic,strong) UIPickerView *pickView;
 /** 选中的省会索引，用来保存上一次选择的省索引，防止同时拖拽省和市时报错 */
 @property(nonatomic,assign) NSInteger proIndex;
 @end

 @implementation ViewController

 // 重写get方法，实现懒加载
 - (NSMutableArray *)provinces
 {
     if (_provinces == nil) {
         // 初始化数据模型，必须要实例化对象！国旗选择的练习中没有实例化，数据出不来，找了老半天！
         _provinces = [NSMutableArray array];
         NSString *path = [[NSBundle mainBundle] pathForResource:@"provinces.plist" ofType:nil];
         NSArray *dicArray = [NSArray arrayWithContentsOfFile:path];
         for (NSDictionary *dict in dicArray) {
             ChaosProvince *province = [ChaosProvince provinceWithDict:dict];
             [_provinces addObject:province];
         }
     }
     return _provinces;
 }

 - (void)viewDidLoad {
     [super viewDidLoad];

     _cityLabel.delegate = self;

     _birthdayLabel.delegate = self;
     [self setBirthdayInputView];
     [self setCitiesInputView];
 }
 /** 给文本框设置时间选择器的方法 */
 - (void)setBirthdayInputView
 {
     // 给生日文本框设置datePicker
     _datePicker = [[UIDatePicker alloc] init];
     // 设置时间选择器的语言 zh--中国
     _datePicker.locale = [[NSLocale alloc] initWithLocaleIdentifier:@"zh"];
     // 设置时间选择器显示的时间格式
     _datePicker.datePickerMode = UIDatePickerModeDate;
     _birthdayLabel.inputView = _datePicker;
     // 想要监听一个控件，没有delegate，就找addTarget方法（这个的前提是控件继承自UIControl）
     [_datePicker addTarget:self action:@selector(dateChange:) forControlEvents:UIControlEventValueChanged];
 }
 /** 监听时间选择器改变的方法 */
 - (void)dateChange:(UIDatePicker *)datePicker
 {
     // 取出时间
     NSDate *date = datePicker.date;
     // NSDate与NSString之间的转换
     NSDateFormatter *formatter = [[NSDateFormatter alloc] init];
     formatter.dateFormat =@"yyyy-MM-dd";
     NSString *time = [formatter stringFromDate:date];
     _birthdayLabel.text = time;
 }

 /** 给城市文本框设置选择器的方法 */
 - (void)setCitiesInputView
 {
     _pickView = [[UIPickerView alloc] init];
     _pickView.delegate = self;
     _pickView.dataSource = self;
     _cityLabel.inputView = _pickView;
 }

 #pragma mark - pickView数据源方法
 - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
 {
     if (component == ) { // 省的个数
         return self.provinces.count;
     } else { // 省对应的城市
         ChaosProvince *province = self.provinces[self.proIndex];
         return province.cities.count;
     }
 }

 - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
 {
     return ; // 两列
 }

 #pragma mark - pickerView代理方法
 - (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
 {
     if (component == ) { // 省
         ChaosProvince *province = self.provinces[row];
         return province.name;
     }
     else // 城市
     {
         // 根据省的索引获取对应的城市
         ChaosProvince *province = self.provinces[self.proIndex];
         return province.cities[row];
     }
 }

 // 滚动pickerView就调用
 - (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
 {
     if (component == ) { // 选择省,刷新相应的城市
         [pickerView reloadComponent:];
         // 记录当前选中的省会索引
         self.proIndex = [pickerView selectedRowInComponent:];
     }
     // 显示到文本框中

     // 选中的省
     ChaosProvince *province = self.provinces[self.proIndex];

     // 选中的城市
     NSInteger cityIndex = [pickerView selectedRowInComponent:];
     self.cityLabel.text = [NSString stringWithFormat:@"%@ %@",province.name,province.cities[cityIndex]];

 }

 #pragma mark - <UITextFieldDelegate>
 // 文本框开始编辑的时候执行的方法
 - (void)textFieldDidBeginEditing:(UITextField *)textField
 {
     if (textField == self.birthdayLabel) { //生日文本

         [self dateChange:_datePicker];
     } else if (textField == self.cityLabel) { // 城市文本
         [self pickerView:self.pickView didSelectRow: inComponent:];
     }
 }

 // 是否允许在范围内改变字符
 - (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string
 {
     return NO;
 }
 @end