We are going to have a little fun with the fifth content view. We’re going to see how to add image data to a picker, write a little game that uses a picker with five components.
Step 1: Create a new project from Xcode and select view-base application template.
Step 2: Adding the following code to the controller Header file.
@interface CustomPickerViewController : UIViewController
<UIPickerViewDataSource , UIPickerViewDelegate>
{
IBOutlet UIPickerView *picker;
IBOutlet UILabel *winLabel;
NSArray *column1;
NSArray *column2;
NSArray *column3;
NSArray *column4;
NSArray *column5;
}
@property (nonatomic,retain) UIPickerView *picker;
@property (nonatomic,retain) UILabel *winLabel;
@property (nonatomic,retain) NSArray *column1;
@property (nonatomic,retain) NSArray *column2;
@property (nonatomic,retain) NSArray *column3;
@property (nonatomic,retain) NSArray *column4;
@property (nonatomic,retain) NSArray *column5;
-(IBAction)spin;
Step 3: Double click .xib file to open the file in Interface Builder. Add a label, a picker, and a button. Give the button a title of spin. Next select label , and use the Fonts palette (Alt+T)to make the label’s text nice and big. After getting the text the way you want it, delete the word Label from it , since we don’t want any text displayed until the first time the user wins. After that, make all the connections to outlets and actions. You need to connect the file’s owner’s picker outlet to the picker view, the file’s owner’s winLabel outlet to the label,and the button’s touch up inside event to the spin action. There one additional thing that you need to do. Select the picker, and bring up the attributes inspector. You need to uncheck and checkbox labeled User Interacface Enabled . Now save it, go back to Xcode.
Step 4: We need to add the images that we’ll be using in our game. We’ve included a set of six image files(seven.png, bar.png, crown.png, cherry.png, lemon.png, and apple.png) in your resources folder.
Step 5: We need to add following code to our controller file. First method is spin method fires when the user touches the Spin button . We first declare a few variables that will help us keep track of whether the user has won. Second method is viewDidLoad, first thing we do is load six different images. We do using this using a convenince method on the UIImage class class called imageNamed:
{
BOOL win = NO;
int numInRow = 1;
int lastVal = -1;
for(int i = 0; i<5 ;i++)
{
int newValue = random() % [self.column1 count];
if(newValue == lastVal)
numInRow++;
else
numInRow =1;
lastVal = newValue;
[picker selectRow:newValue inComponent:i animated:YES];
[picker reloadComponent:i];
if(numInRow >= 3)
win = YES;
}
if(win)
winLabel.text = @"WIN!";
else
winLabel.text = @"";
}
- (void)viewDidLoad {
UIImage *seven = [UIImage imageNamed:@"seven.png"];
UIImage *bar = [UIImage imageNamed:@"bar.png"];
UIImage *crown = [UIImage imageNamed:@"crown.png"];
UIImage *cherry = [UIImage imageNamed:@"cherry.png"];
UIImage *lemon = [UIImage imageNamed:@"lemon.png"];
UIImage *apple = [UIImage imageNamed:@"apple.png"];
for(int i =1; i<=5; i++)
{
UIImageView *sevenView = [[UIImageView alloc] initWithImage:seven];
UIImageView *barView = [[UIImageView alloc] initWithImage:bar];
UIImageView *crownView = [[UIImageView alloc] initWithImage:crown];
UIImageView *cherryView = [[UIImageView alloc] initWithImage:cherry];
UIImageView *lemonView = [[UIImageView alloc] initWithImage:lemon];
UIImageView *appleView = [[UIImageView alloc] initWithImage:apple];
NSArray *imageViewArray = [[NSArray alloc] initWithObjects:
sevenView,barView, crownView,cherryView,lemonView,appleView,nil];
NSString *fieldName = [[NSString alloc] initWithFormat:@"column%d",i];
[self setValue:imageViewArray forKey:fieldName];
[fieldName release];
[imageViewArray release];
[sevenView release];
[barView release];
[crownView release];
[cherryView release];
[lemonView release];
[appleView release];
}
srandom(time(NULL));
}
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
return 5;
}
-(NSInteger)pickerView:(UIPickerView *)pickerView
numberOfRowsInComponent:(NSInteger)component
{
return [self.column1 count];
}
-(UIView *)pickerView:(UIPickerView *)pickerView
viewForRow:(NSInteger)row
forComponent:(NSInteger)component reusingView:(UIView *)view
{
NSString *arrayName = [[NSString alloc] initWithFormat:@"column%d",component+1];
NSArray *array = [self valueForKey:arrayName];
return [array objectAtIndex:row];
}
Step 6: Now compile your application and you can play your application on Simulator. ( see figure 1)
Figure 1: Our five component picker.
You can downloaded SourceCode from here CustomPicker 2
