UIPickerView组件的使用之——省市联动

 第一步:选择Iphone的屏幕


注意:在选择屏幕后如果工程在别的地方打开需要重新选择对应的屏幕 也就是与之对应的Size Class,否则的话是不会显示组件的。

第二步:建立约束,进行屏幕适配。


第三步:设置PickerView的数据源和代理对象为当前的控制器。


第四步:让PIckerView所在的控制器遵循对应的代理协议。并实现对应的数据源和代理方法。


第五步:新建或建好资源文件拖进去。


运行效果如下:


关于数据源和协议方法可以直接点进去拷贝。

在实现省市联动功能时需要注意的两点如下:

(一)设置选中省份的索引为全局变量。以便刷新第二列对应的城市时使用。

(二)在选中行的代理方法中不管第二列之前选中第几行,在刷新数据后都重新显示第一行。

具体工程如下:

建立与Plist文件对应的Model类Province

Province.h

//
//  Province.h
//  03.省市联动
//
//  Created by 刘刘勋 on 16/1/3.
//  Copyright © 2016年 aaaaa. All rights reserved.
//

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface Province : NSObject
@property(nonatomic, copy)NSString *name;
@property(nonatomic, strong)NSArray *cities;

-(instancetype)initWithDic:(NSDictionary *)dic;
+(instancetype)provinceWithDic:(NSDictionary *)dic;

+(NSArray *)provinceList;

@end

Province.m

//
//  Province.m
//  03.省市联动
//
//  Created by 刘刘勋 on 16/1/3.
//  Copyright © 2016年 aaaaa. All rights reserved.
//

#import "Province.h"

@implementation Province

-(instancetype)initWithDic:(NSDictionary *)dic{
    if (self = [super init]) {
        [self setValuesForKeysWithDictionary:dic];
    }
    return self;
}

+(instancetype)provinceWithDic:(NSDictionary *)dic{
    return [[self alloc] initWithDic:dic];
}

+(NSArray *)provinceList{
  
    //PList文件路径
    NSString *filePath = [[NSBundle mainBundle] pathForResource:@"provinces" ofType:@"plist"];
    NSArray *provincePlist = [NSArray arrayWithContentsOfFile:filePath];
    NSMutableArray *provinceM = [NSMutableArray array];
    for (NSDictionary *dic in provincePlist) {
        Province *prov = [Province provinceWithDic:dic];
        [provinceM addObject:prov];
    }
    return provinceM;
}

@end
在PickerView所在的控制器内编辑如下:

viewController.m

//
//  ViewController.m
//  03.省市联动
//
//  Created by 刘刘勋 on 16/1/3.
//  Copyright © 2016年 aaaaa. All rights reserved.
//

#import "ViewController.h"
#import "Province.h"

@interface ViewController ()<UIPickerViewDataSource,UIPickerViewDelegate>
@property(nonatomic, strong)NSArray *provinces;
@property(nonatomic, assign)NSInteger indexOfProvince; //当前默认选中的省份

@end

@implementation ViewController

-(NSArray *)provinces{
    if (!_provinces) {
        _provinces = [Province provinceList];
    }
    return _provinces;
}

- (void)viewDidLoad {
    [super viewDidLoad];
   

}



// returns the number of 'columns' to display.
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{
    return 2;
}

// returns the # of rows in each component..
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{
    if (component == 0) { // 第一列显示省份
        return self.provinces.count;
    }
    
    // 获取对应省份的城市个数
    Province *province = self.provinces[self.indexOfProvince];
    return province.cities.count;
}

#pragma mark - 显示数据
-(NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{

    if (component == 0) { //显示省份的名称
        Province  *province = self.provinces[row];
        return province.name;
    }
  
    // 获取选中的城市,显示城市的名称
    Province *selectedProvince = self.provinces[self.indexOfProvince];
    return selectedProvince.cities[row];
}

//-(UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view
//{
//    UILabel *label = (UILabel *)view;
//    if (!label) {
//        label = [[UILabel alloc] init];
//    }
//    
//    if (component == 0) { // 显示省份的名称
//        // 对应列行的省份
//        Province *province = self.provinces[row];
//        label.text = province.name;
//        label.backgroundColor = [UIColor grayColor];
//    }else{
//    
//    // 获取选中的城市,显示城市的名称
//    Province *selectedProvince = self.provinces[self.indexOfProvince];
//    label.text = selectedProvince.cities[row];
//    label.backgroundColor = [UIColor blueColor];
//    }
//    
//    return label;
//}

#pragma mark - 选中行
-(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
{
    if (component == 0) { // 第一列省选中后,就要更新第二列的数据
        // 更新选中省份的索引
        self.indexOfProvince = row;
        
        // 刷新数据
        // 全部刷新
        // [pickerView reloadAllComponents];
        
       // 部分刷新
        [pickerView reloadComponent:1];
        
        // 不管第二列选中第几行,重新刷新数据后,都显示第二列的第一行
        [pickerView selectRow:0 inComponent:1 animated:YES];
    }
}

#pragma mark 设置每一列的宽度

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

    if (component == 0) {
        return 80;
    }
    return 200;
}
@end



你可能感兴趣的:(UIPickerView组件的使用之——省市联动)