IOS UI控件之Picker View

Picker View的使用,通常有一系列相同类型元素的控件都会有一些代理方法和数据源.像tableView 、CollectionView等。Picker也是一样的,以前学过了tableView，这次再次使用Picker的时候就轻松了很多。

首先，说一下最近看到的一点细微的知识点吧.这点肯定很多人都知道了。不过还是要记录一下的。最近在iphone中使用[UIScreen mainScreen].bounds看到了整个能操作屏幕大小为(375, 667),除去状态栏要占用的20，所以可用高度就是647了。开发的时候还是要注意的。

下面来关于PickerView怎么使用。我是刚开始学就是IOS 8开始的。也没接触过别的版本。所以就直接用storeboard 来开发界面了。当然使用代码也是可以的。两者都不是很难。首先在storeboard中拖一个Picker View。并且使用IBOutlet 来连接类中的控件属性。在viewController中声明要实现的代理。在.m文件中实现相关的数据源和代理。就能够完成Picker View的初始化了》

下面是.m文件的相关实现代码

<span style="font-family:Comic Sans MS;font-size:18px;">//
//  SecondViewController.m
//  PickerDemo
//
//  Created by terry on 14/12/22.
//  Copyright (c) 2014年 huawei. All rights reserved.
//

#import "NormalViewController.h"

@interface NormalViewController ()<UIPickerViewDelegate,UIPickerViewDataSource> {
    NSMutableArray *_country;
}
@property (weak, nonatomic) IBOutlet UIPickerView *countryPicker;
@property (weak, nonatomic) IBOutlet UIPickerView *clubPicker;

@end

@implementation NormalViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    _country = [NSMutableArray arrayWithObjects:@"中国", @"美国", @"日本", @"韩国", nil];
    
    self.countryPicker.delegate = self;
}

- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
    return 1;
}
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
    
}
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
    return [_country count];
}

- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
    return _country[row];
}
@end
</span>

这样就能够完成Picker View的简单使用了。确实很简单吧

后面完成两个Picker..这个差不多跟tableView中的section一样,只需要在

<span style="font-family:Comic Sans MS;font-size:18px;">- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
    return 2;
}</span>

<span style="background-color: rgb(255, 255, 255);"><span style="font-family:Comic Sans MS;font-size:18px;">这个代理方法中返回2或者n即可.在另外的两个代理方法中分别通过compont来定义数据源。</span></span>

下面是实现的两个Picker同时使用的写法

<span style="font-family:Comic Sans MS;font-size:18px;">- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
//
//  SecondViewController.m
//  PickerDemo
//
//  Created by terry on 14/12/22.
//  Copyright (c) 2014年 huawei. All rights reserved.
//

#import "NormalViewController.h"

@interface NormalViewController ()<UIPickerViewDelegate,UIPickerViewDataSource> {
    NSMutableArray *_country;
    NSMutableArray *_clubArray;
}
@property (weak, nonatomic) IBOutlet UIPickerView *countryPicker;
@property (weak, nonatomic) IBOutlet UIPickerView *clubPicker;

@end

@implementation NormalViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    _country = [NSMutableArray arrayWithObjects:@"中国", @"美国", @"日本", @"韩国", nil];
    _clubArray = [NSMutableArray arrayWithObjects:@"LGD", @"IG", @"CK", @"DK", nil];
    self.countryPicker.delegate = self;
}

- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
    return 2;
}
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
    
}
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
    if (component == 0) {
        return [_country count];
    }else {
        return [_clubArray count];
    }
    
}

- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
    if (component == 0) {
        return [_country objectAtIndex:row];
    }else {
        return [_clubArray objectAtIndex:row];
    }
}
@end
}
</span>

后面就是相关联Picker的使用了。其实不用之前也应该能够想到，就是使用字典等数据结构把数据绑定在一起就可以了当第一个Picker中的数据显示时，判断选中的item，更新第二个或者第三个Picker即可.下面是我写的一个具体实现

//
//  SecondViewController.m
//  PickerDemo
//
//  Created by terry on 14/12/22.
//  Copyright (c) 2014年 huawei. All rights reserved.
//

#import "NormalViewController.h"

@interface NormalViewController ()<UIPickerViewDelegate,UIPickerViewDataSource> {
    NSMutableArray *_country;
    NSMutableArray *_clubArray;
    NSMutableDictionary *_dict;
    NSMutableArray *_data;
    NSString *_countrySelect;
}
@property (weak, nonatomic) IBOutlet UIPickerView *countryPicker;
@property (weak, nonatomic) IBOutlet UIPickerView *clubPicker;

@end

@implementation NormalViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    _country = [NSMutableArray arrayWithObjects:@"中国", @"美国", @"日本", @"韩国", nil];
    _clubArray = [NSMutableArray arrayWithObjects:@"LGD", @"IG", @"CK", @"DK", nil];
    _data = _country;
    _dict = [NSMutableDictionary dictionary];
    
    [_dict setObject:_country forKey:@"country"];
    [_dict setObject:_clubArray forKey:@"club"];
    
    self.countryPicker.delegate = self;
}

- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
    return 2;
}
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
    if (component == 0) {
        _data= [_dict objectForKey:[[_dict allKeys] objectAtIndex:row]];
        [pickerView selectRow:0 inComponent:1 animated:YES];
        [pickerView reloadComponent:1];
    }
}
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
    if (component == 0) {
        return [_dict allKeys].count;
    }else {
        return _data.count;
    }
    
}

- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
    if (component == 0) {
        return [_dict allKeys][row];
    }else {
        return _data[row];
    }
}
@end

这样就完成了Picker View的基本功能了。

后面有一个 DatePicker 一个具体的实例，通过datePicker.date来获取 选中的日期.具体的代码就不具体看了。这个就更加简单了。