Button View in iPhone

This is the ButtonView example. In this example we will see how to mewView will come after pressing button. So let see how it will work.
 Open the Xcode, Make a new project using View Base application. Provide the application “ButtonView”.

Xcode automatically creates the directory structure and adds important frameworks into it. It is possible to explore the directory structure to see the content of the directory.

We have to add three ViewController class in the project. So simply select the project -> New File -> Cocoa Touch ->ViewController class and give the class name “PickerView”,”SoundView” and “ImageView”.

• We need to add images in the resource folder.

• Open the ButtonViewViewController.h file , make the following adjustments to the file:

#import <UIKit/UIKit.h> @class PickerView;
@class SoundView;
@class ImageView;
@interface ButtonViewViewController : UIViewController {
PickerView *pickerView;
SoundView *soundView;
ImageView *imageView;
UIButton *pickerbutton;
UIButton *songbutton;
UIButton *imagebutton;
}
@property(nonatomic, retain) IBOutlet  PickerView *pickerView;
@property(nonatomic, retain) IBOutlet  SoundView *soundView;
@property(nonatomic, retain) IBOutlet  ImageView *imageView;
@property(nonatomic, retain) IBOutlet  UIButton *pickerbutton;
@property(nonatomic, retain) IBOutlet  UIButton *songbutton;
@property(nonatomic, retain) IBOutlet  UIButton *imagebutton;
-(IBAction)FirstButton:(id)sender;
-(IBAction)SecondButton:(id)sender;
-(IBAction)ThirdButton:(id)sender;
@end

• Double click on the ButtonViewViewController.xib file and open it to the Interface Builder. First drag three Round Rect Button and place it to the view window.Give the button name PickerView, SoundView and ImageView (See the figure 1). Select PickerView button from the View and bring up Connection Inspector right now connect Touch Up Inside to the File’s Owner icon and select FirstButton: method, do the same principle for other two button and choose SecondButton: and ThirdButton: method. Now save the .xib file, close it and get back on the Xcode.

 

• In the ButtonViewViewController.m file make the following modifications in the file:

#import "ButtonViewViewController.h"
#import "PickerView.h"
#import "SoundView.h"
#import "ImageView.h" @implementation ButtonViewViewController
@synthesize pickerbutton,songbutton,imagebutton,pickerView,soundView,imageView;
-(IBAction)FirstButton:(id)sender
{
pickerView = [[PickerView alloc]initWithNibName:@"PickerView"bundle:nil];
[self.view addSubview:pickerView.view];
}
-(IBAction)SecondButton:(id)sender
{
soundView = [[SoundView alloc]initWithNibName:@"SoundView"bundle:nil];
[self.view addSubview:soundView.view];
}
-(IBAction)ThirdButton:(id)sender
{
imageView = [[ImageView alloc]initWithNibName:@"ImageView"bundle:nil];
[self.view addSubview:imageView.view];
}
- (void)dealloc
{
[super dealloc];
[pickerView.view release];
[soundView.view release];
[imageView.view release];
}
- (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.
}
#pragma mark – View lifecycle
- (void)viewDidUnload
{
[super viewDidUnload];
}
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
// Return YES for supported orientations
return (interfaceOrientation == UIInterfaceOrientationPortrait);
}
@end

• Open the PickerView.h file to make the subsequent changes in the file as shown here:

#import <UIKit/UIKit.h>
@interface PickerView : UIViewController
{
IBOutlet UIPickerView *singlePicker;
NSArray *pickerData;
} @property(nonatomic , retain) UIPickerView *singlePicker;
@property(nonatomic , retain) NSArray *pickerData;
-(IBAction)buttonPressed;
-(IBAction)BackButton:(id)sender;
@end

• Double click the PickerView.xib file and open it up to the Interface Builder. First drag the Picker View, Navigation Bar and Round rect button from your library and set it to the view window (See figure 2). Opt for the Picker View from the view window and bring up Connection Inspector connect dataSource and delegate to the File’s Owner icon. Connect File’s Owner icon to the Picker view and select singlePicker. Drag the Round Rect button place it on the Navigation Bar. Select the button and bring up Attribute Inspector and choose “backbutton.png”. Now pick the back button and bring up Connection Inspector connect Touch Up Inspector to the File’s Owner icon select BackButton: method. Now save the .xib file, close it and go back to the Xcode.

        

• In the PickerView.m file make following changes :

#import "PickerView.h" @implementation PickerView
@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)BackButton:(id)sende
{
[self.view removeFromSuperview];
}
-(IBAction)buttonPressed
{
NSInteger row = [singlePicker selectedRowInComponent:0];
NSString *selected = [pickerData objectAtIndex:row];
NSString *title = [[NSString alloc] initWithFormat:
@"you selected %@!", selected];
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:title
message : @"Thank you for choosing."
delegate:nil
cancelButtonTitle :@"You are Welcome"
otherButtonTitles :nil];
[alert show];
[alert release];
[title release];
}
// Implement viewDidLoad to do additional setup after loading the view, typically from a nib.
- (void)viewDidLoad {
NSArray *array = [[NSArray alloc]:@"Luke",@"Leia",@"Han",@"Chewbacca",@"Artoo", initWithObjects
@"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

• Open the SoundView.h file and make the below changes in the file:

#import <UIKit/UIKit.h>
@interface SoundView : UIViewController { IBOutlet UIButton *Soundstart;
}
@property(nonatomic,retain)IBOutlet UIButton *Soundstart;
-(IBAction) soundplay:(id) sender;
-(IBAction) soundstop:(id) sender;
-(IBAction) BackButton:(id) sender;
@end

• Double click the SoundViewxib file and open it up on the Interface Builder. Drag two Round Rect Button and Navigation Bar on the view window. Give the Round Rect button name “Play Sound” and “Stop Sound” . Now select “Play Sound” button and bring up Connection Inspector, connect touch Up Inside to the File’s Owner icon and select soundplay: method, do exactly the same thing for another button and select soundstop: method. Drag the Round Rect Button and place it on the Navigation Bar. Choose the Round Rect Button and choose “backbutton.png”(See figure 3). Now choose the back button and bring up Connection Inspector and connect Edit Inside to the File’s Owner icon and choose BackButton: method. Now save the .xib file, close it and go back to the Xcode.

• We need to add two framework in the FrameWork folder. So add “AudioToolbox.framework” and “AVFoundation.framework”.
• In the SoundView.m file make the subsequent modifications to the file:

#import "SoundView.h"
#import <AVFoundation/AVFoundation.h> @implementation SoundView
@synthesize Soundstart;
AVAudioPlayer *player;
-(IBAction)soundplay:(id)sender
{
NSString* resourcePath = [[NSBundle mainBundle] resourcePath];
resourcePath = [resourcePath stringByAppendingString:@"/sound.wav"];
NSError* err;
//Initialize our player pointing to the path to our resource
player = [[AVAudioPlayer alloc] initWithContentsOfURL:
[NSURL fileURLWithPath:resourcePath] error:&amp;err];
if( err ){
//bail!
NSLog(@"Failed with reason: %@", [err localizedDescription]);
}
else{
//set our delegate and begin playback
player.delegate = self;
[player play];
}
}
-(IBAction)soundstop:(id)sender
{
if (player != nil &amp;&amp; [player isPlaying])
{
[player stop];
}
}
-(IBAction) BackButton:(id) sender
{
[self.view removeFromSuperview];
}
- (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.
}
#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

• Open the ImageView.h file and make the following alterations in the file:

#import <UIKit/UIKit.h>
@interface ImageView : UIViewController {
UIImageView *image;
} @property(nonatomic, retain) IBOutlet  UIImageView *image;
-(IBAction)BackButton:(id)sender;
@end

• Double click on the ImageView.xib file and open it up the Interface Builder. First drag the navigation bar and image view in the library and place it to the view window. And drag the Round rect Button and place it on the Navigation bar. Simply select the Button and bring up Attributes Inspector and select “backbutton.png”. Select the Image view and bring up Attribute Inspector select the “image006.png” file (See figure 4). Now save the .xib file, close it and go back to the Xcode.

• Now compile and run the application on the Simulator.

  

For detailed information please visit button view iPhone