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，彈出：