[iOS基础控件 - 6.10.1] PickerView 餐点搭配Demo

A.需求
1.使用PickerView做出有3列餐点（水果、主菜、饮料）的搭配Demo
2.选择的餐点实时显示在“显示区”
3.提供“随机”按钮，随机选择菜品搭配
 
B.实现步骤
1.拖入一个PickerView
Image(143)
 
2.用控制器配置dataSource和delegate
 1 // 遵守UIPickerViewDataSource,UIPickerViewDelegate
 2 @interface ViewController () <UIPickerViewDataSource, UIPickerViewDelegate>
 3 
 4 /** 选择器 */
 5 @property (weak, nonatomic) IBOutlet UIPickerView *pickerView;
 6 
 7 @end
 8 
 9 @implementation ViewController
10 
11 - (void)viewDidLoad {
12     [super viewDidLoad];
13     // Do any additional setup after loading the view, typically from a nib.
14    
15     // 设置dataSource
16     self.pickerView.dataSource = self;
17     // 设置delegage
18     self.pickerView.delegate = self;
19 }
 
3.实现代理方法
 1 #pragma mark - 代理方法
 2 /** 列数 */
 3 - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
 4     return 3;
 5 }
 6 
 7 /** 对应列的行数 */
 8 - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
 9     return 5;
10 }
11 
12 /** 对应列和行的显示内容 */
13 - (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
14     return @"内容";
15 }
 
Image(144)
 
4.引入plist文件，读取数据
Image(145)
 
 1 /** 加载数据，延迟加载 */
 2 - (NSArray *) foodCategories {
 3     if (nil == _foodCategories) {
 4         _foodCategories = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"foods.plist" ofType:nil]];
 5     }
 6     
 7     return _foodCategories;
 8 }
 9 
10 #pragma mark - dataSource方法
11 /** 列数 */
12 - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
13     return self.foodCategories.count;
14 }
15 
16 /** 对应列的行数 */
17 - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
18     NSArray *foods = self.foodCategories[component];
19     return foods.count;
20 }
21 
22 
23 #pragma mark - delegate方法
24 /** 对应列和行的显示内容 */
25 - (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
26     NSArray *foods = self.foodCategories[component];
27     return foods[row];
28 }
 
 
Image(146)
 
5.制作显示区
Image(147)
 
1 /** 水果 */
2 @property (weak, nonatomic) IBOutlet UILabel *fruitLabel;
3 /** 主菜 */
4 @property (weak, nonatomic) IBOutlet UILabel *mainLabel;
5 /** 饮料 */
6 @property (weak, nonatomic) IBOutlet UILabel *drinkLabel;
 
6.响应选择事件
 1 /** 响应选择餐点事件 */
 2 - (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
 3     NSArray *foods = self.foodCategories[component];
 4     NSString *food = foods[row];
 5    
 6     switch (component) {
 7         case 0:
 8             self.fruitLabel.text = food;
 9             break;
10         case 1:
11             self.mainLabel.text = food;
12             break;
13         case 2:
14             self.drinkLabel.text = food;
15             break;
16         default:
17             break;
18     }
 
Image(148)
 
7.制作“随机”功能
 1 /** 随机选择餐点 */
 2 - (IBAction)onRandomClicked {
 3     // 循环所有餐点种类
 4     for (int i=0; i<self.foodCategories.count; i++) {
 5         // 之前选择的餐点行数
 6         NSInteger originalRow = [self.pickerView selectedRowInComponent:i];
 7        
 8         NSInteger row = originalRow;
 9        
10         // 此种类内含有的所有餐点
11         NSArray *foods = self.foodCategories[i];
12         // 如果随机的餐点跟上一次的相同，继续随机
13         while (row == originalRow) {
14             row = arc4random() % foods.count;
15         }
16        
17         // 通知pickerView改变选择
18         [self.pickerView selectRow:row inComponent:i animated:YES];
19        
20         // 改变显示区
21         [self pickerView:self.pickerView didSelectRow:row inComponent:i];
22     }
23 }
 
Image(149)
 
 
 
posted @ 2014-12-16 15:55  HelloVoidWorld  阅读(460)  评论(3)  编辑  收藏  举报