iOS development UI Chapter-use the Picker view control to complete a simple meal selection application
First, the realization effect
Description: Click the Random button, can be automatically selected, the data is automatically refreshed below.
Second, the realization of ideas
1.picker view has a default height of 162 and cannot be modified. 2. Display the data, you need to set up a data source, there are two ways (become a data source, Compliance Agreement) 3. Implement two methods within the data source 1) Returns the total number of columns 2) in this column, the total number of rows 4. Tell it through the proxy which row of that column shows which data (set its proxy as Controller) 5. Load all food with lazy loading 6. Complete the presentation of basic data (columns, rows, contents) 7. Automatically update the selected food letter Interest. (Use a large view, put 6 labels on it) 1) Assign 3 labs, add three properties (fruit, main course, drink) 2) listen to which line is selected (listening has two ideas, one is agent, one is notification), First look at the method that has no proxy (Didselectrow) This method is called when a row is selected, and the selected column number and line number are passed in as parameters. Can get the corresponding column number and line number. 3) The listener method that is called when the selection is completed 4) set the default selection in Viewdidload, set to [0][1] 5) Increased scalability (manually calling those lines-using a For loop) 8. Implementation of the Random function 1) How to let the code select a row (SelectRow), call the method can specify which row to scroll to that column 2) to achieve the function of the head (using a large uiview, which puts two child controls) 3) Set height 4 4, how to make the position of the random button centered? You can set its height to 44 and the maximum Y value to 64. 4) Set the Random button's Click event Randomfood, let Pickerview actively select a row. 5) The method of generating the random number (the limit of generating random number, no more than the current total) 6) disadvantage, in the future after the data changes, will be error (modulo in a few) [Self.foods[0] count]? Why not use shorthand syntax? (Remember to keep in mind) 7) random number processing is not rigorous, sometimes generated random number may be equal, then the column will not scroll, get to the corresponding column of the total number of data, how to get the last generated random value (that is, the currently selected row), compare the last line number and the current generated random number is the same, If the same, rewrite the build 9. To solve another problem, the following data random refresh is invalid, select a row by code.
iii. Implementing code examples1. Project document structure and storyboard file Storyboard file large interface settings: 2. Code sample host controller file code:
1//2//Yyviewcontroller.m3//06-Implementation of a simple vegetable selection system4//5//Created by Apple on 14-6-5.6//Copyright (c) 2014 itcase. All rights reserved.7//89#import"YYViewController.h"1011//Compliance with data sources and proxy protocols12@interface Yyviewcontroller () <UIPickerViewDataSource,UIPickerViewDelegate>13/**14* Fruit15*/@property (Strong, nonatomic) iboutlet UILabel *Fruitlab;17/**18* Main Course19*/@property (Strong, nonatomic) iboutlet UILabel *Staplelab;21st/**22* Beverage23*/@property (Strong, nonatomic) iboutlet UILabel *Drinklab;25/**26* Save all the data27*/@property (nonatomic,strong) Nsarray *Foods@property (Weak, nonatomic) Iboutlet Uipickerview *Pickerview;-(Ibaction) Randomfood: (Id) sender;3132@end3334@implementationYyviewcontroller3536-(void) Viewdidload37{38[Super Viewdidload];3940//Here you set the initial display of the Data refresh section below41for (int component =0; component<self.foods.count; component++) {[Self Pickerview:nil didselectrow:0Incomponent:component];43}44}4546#pragma mark-use lazy loading to load data in-(Nsarray *) Foods48{49if (_foods==Nil) {NSString *fullpath=[[nsbundle Mainbundle]pathforresource:@"Foods.plist"Oftype:nil];Wuyi Nsarray *arraym=[Nsarray Arraywithcontentsoffile:fullpath];_foods=Arraym;53}54Return_foods;55}5657#pragma mark-Handle click events for random buttons-(Ibaction) Randomfood: (Id) Sender {5960//Let Pickerview actively select a row61//Let Pickerview select Row row for incomponent column62//[Self.pickerview selectrow:1 incomponent:0 Animated:yes];6364/*65[Self.pickerview selectrow:arc4random ()% incomponent:0 Animated:yes];66[Self.pickerview selectrow:arc4random ()% incomponent:1 Animated:yes];67[Self.pickerview selectrow:arc4random ()% incomponent:2 Animated:yes];68*/6970//[Self.foods objectatindex:0]; = = Self.foods[0];71//[Self.foods[0] count];7273/*74Generate random values based on the number of elements in each column75[Self.pickerview selectrow:arc4random ()% [self.foods[0] count] incomponent:0 Animated:yes];76[Self.pickerview selectrow:arc4random ()% [self.foods[1] count] incomponent:1 Animated:yes];77[Self.pickerview selectrow:arc4random ()% [self.foods[2] count] incomponent:2 Animated:yes];78*/7980//Set a random number81for (int component=0; component<self.foods.count; component++) {82//Gets the number of data elements that correspond to the current column83int total=[Self.foods[component] count];84//Generates a random number based on the total number of each column (the currently generated random number)85int Randomnumber=arc4random ()%Total86 87//Gets the currently selected row (the line that was moved to after the last random) Oldrow=[self.pickerview int selectedrowincomponent:0]; 89 90//Compare the last line number and the currently generated random number is the same, if the same then regenerate the "Oldrow==randomnumber" {randomnumber=arc4random ()%total; 93} 94 95 Let Pickerview scroll to a specified line [Self.pickerview selectrow:randomnumber incomponent:component Animated:yes]; 97//simulation, select a line by Code 98 [self Pickerview:nil didselectrow:randomnumber incomponent:component]; }100}101 102 #pragma mark-Set data 103//altogether how many columns 104-(Nsinteger) Numberofcomponentsinpickerview: (Uipickerview *) pickerView105 {106 return self.foods.count;107}108 109//Each column corresponds to how many lines-(Nsinteger) Pickerview: (Uipickerview *) Pickerview Numberofrowsincomponent: (Nsinteger) component111 {112//1. Gets the current column 113 Nsarray *araym= self.foods[component];114//2. Returns the number of rows corresponding to the current column. araym.count;116}117 118//Each column corresponds to what data is displayed 119-(NSString *) Pickerview: (Uipickerview *) Pickerview Titleforrow: (Nsinteger) Row forcomponent: (Nsinteger) component120 {121//1. Get current column 122 Nsarray *araym= self.foods[ Component];123//2. Gets the row for the current columnData 124 NSString *name=araym[row];125 return name;126}127 #pragma mark-set data refresh below 129//When a row of Pickerview is selected call 130// Pass the selected column and line numbers as parameters 131//The Pickerview is called only when a row is selected by the finger (void): (Uipickerview *) Pickerview Didselectrow: (Nsinteger) Row incomponent: (Nsinteger) component133 {134//Get corresponding column, data for corresponding row 135 nsstring *name=self.foods[component][row];136//Assignment 137 if (0==component) {138 self.fruitlab.text=name;139}else if (1==component). {141 self.staplelab.text=name;142} else143 self.drinklab.text=name;144}145 146 #pragma mark-hidden status bar 147-(BOOL) prefersStatusBarHidden148 {149 return yes;150 }151 @end
iOS development UI Chapter-use the Picker view control to complete a simple meal selection application