How To Select Component From UIPickerView And Display The Next Screen

This is the UIPickerView example. In this example we will see how to select any name from singlecomponentpicker and display the next screen. So let see how it will work.

Step 1: Open a Xcode, Create a View base application. Give the application name “SingleComponentPicker”.

Step 2: Xcode automatically creates the directory structure and adds essential frameworks to it. You can explore the directory structure to check out the content of the directory.

Step 3: We need to add one UIViewController class in the project. So select the project -> New File -> Cocoa Touch -> ViewController subclass and give the class name “AnotherView”.

Step 4: Open the SingleComponentPickerViewController.h file and add UIPickerViewDataSouce and UIPickerViewDelegate protocal, import AnotherView class, UIPickerView and NSArray class and one buttonPressed method:. So make the following changes in the file:

 

#import <uikit/UIKit.h>

@class AnotherView;

@interface SingleComponentPickerViewController : UIViewController
<uipickerViewDataSource , UIPickerViewDelegate>
{

AnotherView *anotherView;
IBOutlet UIPickerView *singlePicker;
NSArray *pickerData;
}

@property(nonatomic , retain) UIPickerView *singlePicker;
@property(nonatomic , retain) NSArray *pickerData;

-(IBAction)buttonPressed;

@end

 

 

Step 5: Double click .xib file and open it to interface Builder. Add a picker and a button to te View,and  then make the necessary connections. Control drag File’s Owner to the picker view,and select singlePicker outlet. Then single click the picker, bring up connection inspector, you’ll see that the first two items are DataSource and Delegate. Drag from the circle next to DataSource to the File’s Owner icon. Do it once again, and connect Delegate to File’s Owner icon. Next drag a Round Rect Button to the view, double-click it, give it a title of Select. Connect to Touch Up Inside to File’s Owner  and select buttonPressed action. Save the nib, and go back to Xcode.

Step 6: Now open the SingleComponentPickerViewController.m file and make the following changes in the file:

 

#import "SingleComponentPickerViewController.h"
#import "AnotherView.h"

@implementation SingleComponentPickerViewController
@synthesize singlePicker;
@synthesize pickerData;

// The designated initializer. Override to perform setup that is required before the view is loaded.
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {
if (self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil]) {
// Custom initialization
}
return self;
}

-(IBAction)buttonPressed
{

anotherView = [[AnotherView alloc]
initWithNibName:@"AnotherView"
bundle:nil];
[self.view addSubview:anotherView.view];

}

// Implement viewDidLoad to do additional setup after loading the view, typically from a nib.
- (void)viewDidLoad {
NSArray *array = [[NSArray alloc] initWithObjects:@"Luke",@"Leia",@"Han",@"Chewbacca",@"Artoo",
@"Threepio",@"lando",nil];
self.pickerData = array;
[array release];
[super viewDidLoad];
}

// Override to allow orientations other than the default portrait orientation.
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
// Return YES for supported orientations
return (interfaceOrientation == UIInterfaceOrientationPortrait);
}

- (void)didReceiveMemoryWarning {
// Releases the view if it doesn't have a superview.
[super didReceiveMemoryWarning];

// Release any cached data, images, etc that aren't in use.
}

- (void)viewDidUnload {
// Release any retained subviews of the main view.
// e.g. self.myOutlet = nil;
}

- (void)dealloc {
[singlePicker release];
[pickerData release];
[super dealloc];
}

#pragma mark Picker data source methods
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
return 1;
}

-(NSInteger)pickerView:(UIPickerView *)pickerView
numberOfRowsInComponent:(NSInteger)component
{
return [pickerData count];
}

#pragma mark Picker delegate method
-(NSString *)pickerView:(UIPickerView *)pickerView
titleForRow:(NSInteger)row
forComponent:(NSInteger)component
{
return[pickerData objectAtIndex:row];
}
@end

 

 

Step 7: Open the AnotherView.h file and added UIButton class and BackButton method and import SingleComponentViewController class now make the following changes in the file.

 

#import <uikit/UIKit.h>

@class SingleComponentPickerViewController;

@interface AnotherView : UIViewController {

SingleComponentPickerViewController *singleComponentView;

UIButton *backButton;

}

@property (nonatomic, retain) UIButton *backButton;

-(IBAction)backButton :(id)sender;

@end

 

 

Step 8: Double click the AnotherView.xib file and open it to the Interface Builder. First drag the label and Button from the library and place it to the View window. Select the label and bring up attribute inspector and change the label name “Another View”, select the button and bring up connection inspector and drag Touch Up Inside to the File’s Owner icon and select BackButton: method. Now save it close it and go back to the Xcode.

Step 9: Open the AnotherView.m file and make the following changes:

 

#import "AnotherView.h"
#import "SingleComponentPickerViewController.h"

@implementation AnotherView

@synthesize backButton;

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
// Custom initialization
}
return self;
}

- (void)dealloc
{
[super dealloc];
}

- (void)didReceiveMemoryWarning
{
// Releases the view if it doesn't have a superview.
[super didReceiveMemoryWarning];

// Release any cached data, images, etc that aren't in use.
}

-(IBAction)backButton :(id)sender

{
singleComponentView = [[SingleComponentPickerViewController alloc]
initWithNibName:@"SingleComponentPickerViewController"bundle:nil];

[self.view addSubview:singleComponentView.view];
[singleComponentView.view release];}

#pragma mark - View lifecycle

- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view from its nib.
}

- (void)viewDidUnload
{
[super viewDidUnload];
// Release any retained subviews of the main view.
// e.g. self.myOutlet = nil;
}

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
// Return YES for supported orientations
return (interfaceOrientation == UIInterfaceOrientationPortrait);
}

@end

 

 

Step 10: Now compile and run the application in the Simulator.

You can Download SourceCode from here SingleComponentPicker

Leave a Comment:

6 comments
Kiran says May 16, 2011

I have a doubt.. Why havent you released the memory of anotherView in buttonPressed implementation ?

Reply
    Sushant says May 16, 2011

    @Kiran: Thanks For the correction. I have uploaded updated code.Please checked now.

    Reply
LeeH says May 20, 2011

So is the same AnotherView screen displayed, whichever selection is made on the picker?
Thanks.

Reply
    Sushant says May 21, 2011

    Yes this the same AnotherView screen.

    Reply
    ryan says July 27, 2011

    how do we go about making a screen for each selection

    Reply
Michael Henke says September 19, 2012

Completely worthless tutorial as it pays absolutely no attention to the selected value of the picker… It’s just a tutorial on how to load a view from a xib on button press…

Reply
Add Your Reply