IOS UIPickerView控件的关联选择

IOS UIPickerView控件的关联选择

建立一个和左边的列表key对应的数组，当选择这个key时，刷新左边UIPickerView部分的内容显示对应数组的数据，选择时，找到两个UIPickerView部件rowIndex，找出数据，放到TextField里。

我们要实现的效果如下：

当选择左边的一级选项时，左边展示一级选项里含有的二级选项，选择后显示在TextField里。

如何实现呢？建立一个和左边的列表key对应的数组，当选择这个key时，刷新左边UIPickerView部分的内容显示对应数组的数据，选择时，找到

两个UIPickerView部件rowIndex，找出数据，放到TextField里。

1、打开上篇PickerViewDemo项目，在ViewController.h添加两个成员变量：NSArray *subPickerArray; NSDictionary *dicPicker;

[cpp]view plaincopy

1 #import <UIKit/UIKit.h> 

2 

3 @interface ViewController : UIViewController<UIPickerViewDelegate, UITextFieldDelegate,UIPickerViewDataSource> 

4 { 

5 NSArray *pickerArray; 

6 NSArray *subPickerArray; 

7 NSDictionary *dicPicker; 

8 } 

9 - (IBAction)selectButton:(id)sender; 

10 @property (strong, nonatomic) IBOutlet UIToolbar *doneToolbar; 

11 @property (strong, nonatomic) IBOutlet UIPickerView *selectPicker; 

12 @property (strong, nonatomic) IBOutlet UITextField *textField; 

13 @end 

2、初始化

[cpp]view plaincopy

14 - (void)viewDidLoad 

15 { 

16 [super viewDidLoad]; 

17 pickerArray = [NSArray arrayWithObjects:@"动物",@"植物",@"石头", nil]; 

18 dicPicker = [NSDictionary dictionaryWithObjectsAndKeys: 

19 [NSArray arrayWithObjects:@"鱼",@"鸟",@"虫子", nil], @"动物", 

20 [NSArray arrayWithObjects:@"花",@"草",@"葵花", nil], @"植物", 

21 [NSArray arrayWithObjects:@"疯狂的石头",@"花岗岩",@"鹅卵石", nil], @"石头",nil]; 

22 

23 subPickerArray = [dicPicker objectForKey:@"动物"]; 

24 textField.inputView = selectPicker; 

25 textField.inputAccessoryView = doneToolbar; 

26 textField.delegate = self; 

27 selectPicker.delegate = self; 

28 selectPicker.dataSource = self; 

29 selectPicker.frame = CGRectMake(0, 480, 320, 216); 

30 

31 } 

给 NSDictionary *dicPicker;赋值，对应的三个关键字添加了对应的数组。 

3、Component返回两个，这样就有两个齿轮了。

[cpp]view plaincopy

32 -(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{ 

33 return 2; 

34 } 

4、使用宏

在#import "ViewController.h"下面定义两个宏，代表UIPickerView齿轮的左边的部分和右边的部分。左边的部分是0，右边的是1.

#import "ViewController.h"

#define kFirstComponent 0

#define kSubComponent 1

5、判断是那个齿轮，返回相应的数据的Count。

[cpp]view plaincopy

35 -(NSInteger) pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{ 

36 if(component == kFirstComponent){ 

37 return [pickerArray count]; 

38 }else { 

39 return [subPickerArray count]; 

40 } 

41 

42 } 

6、根据component返回相应的String数据

[cpp]view plaincopy

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

44 if(component == kFirstComponent){ 

45 return [pickerArray objectAtIndex:row]; 

46 }else { 

47 return [subPickerArray objectAtIndex:row]; 

48 } 

49 } 

7、拖动左边的齿轮时，右边的数据相应的Reload更新。

[cpp]view plaincopy

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

51 if (component == kFirstComponent) { 

52 subPickerArray = [dicPicker objectForKey:[pickerArray objectAtIndex:row]]; 

53 [pickerView selectRow:0 inComponent:kSubComponent animated:YES]; 

54 [pickerView reloadComponent:kSubComponent]; 

55 } 

56 } 

8、相应选择的数据，并显示在TextField上。

[cpp]view plaincopy

57 -(void)textFieldDidEndEditing:(UITextField *)textField{ 

58 NSInteger firstViewRow = [selectPicker selectedRowInComponent:kFirstComponent]; 

59 NSInteger subViewRow = [selectPicker selectedRowInComponent:kSubComponent]; 

60 NSString * firstString = [pickerArray objectAtIndex:firstViewRow]; 

61 NSString * subString = [[dicPicker objectForKey:[pickerArray objectAtIndex:firstViewRow]] objectAtIndex:subViewRow] ; 

62 NSString *textString = [[NSString alloc ] initWithFormat:@"您选择了：%@%@%@", firstString, @" 里的 ", subString]; 

63 self.textField.text = textString; 

64 } 

65 

66 - (IBAction)selectButton:(id)sender { 

67 [textField endEditing:YES]; 

68 } 

大功告成，运行，点击TextField，弹出：