In one of my earlier post I have shown you how to work with the interface builder but this is the second post that I am writing for the interface builder because in my first post I explained how to display a table view in this post I will be showing a very small and easy example and that would be displaying the name entered in the text field inside the alert view on button touch.
Step 1: Open Xcode and create a windows based application save the project with an appropriate name and then add the UIViewController subclass file into your project and while adding those files please make sure that the WithXIB for user interface is selected here are the pics that would guide you through the entire procedure.
 |
| Select Windows based application |
 |
| Give project a name |
 |
| Adding new file |
 |
| UIViewController with Xib |
Step 2: Select the myviewController.xib file and drag and drop the UIButton and UITextField into the UIView instance. For doing this select the View option from the toolbar and select the third tab which is called as the utility tab and their you will find a set of controls present in the object library.
Step 3: Prepare the IBOutlets for these controls that you have added and then attach them in the myviewController.XIB file and since we want to show the alert box on button touch so for that too we have to write a function make sure that this time the return type of the function is IBAction as we are working with the interface builder you may refer my first tutorial on IB that I wrote if you have any questions on IBOutlet or IBAction or you may mention them in comments.
Declaring the IBOutlets and IBAction method in the myViewController.h file
#import <UIKit/UIKit.h>
@interface myviewController : UIViewController {
IBOutlet UIButton *_btn;
IBOutlet UITextField *_inputField;
}
-(IBAction)displayName;
@end
 |
| Attaching the Button outlet |
 |
| Attaching the textfield outlet |
Select the myviewController.m file and give body to the displayName function here’s the code to do that
-(IBAction)displayName
{
UIAlertView *_alert = [[UIAlertView alloc]initWithTitle:@"iPhone by Radix" message:_inputField.text delegate:nil cancelButtonTitle:@"Cancel" otherButtonTitles:@"Ok", nil];
[_alert show];
[_alert release];
}
Step 4: Now you must have not associated this function with the button so once again open the myviewController.xib file and from their right click the file owner file and on the black popup that will arise you will see an action section and the name of the action method that you have declared so select the method and link it up with the button because on the touch of the button we want that function to be called, but a function gets called on a particular event so when you drag and drop the function on the button it will give you an event list so select touch up inside event from the event list and that’s all that would be required.
 |
| Attaching function with Button |
 |
| Touch up inside event |
Step 5: Select the app delegate .m file and add the myviewController view to the iphone window and heres the code to do that
#import "InterfaceBuilder_DemoAppDelegate.h"
#import "myviewController.h"
@implementation InterfaceBuilder_DemoAppDelegate
@synthesize window=_window;
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
// Override point for customization after application launch.
myviewController *obj = [[myviewController alloc]initWithNibName:@"myviewController" bundle:nil];
[self.window addSubview:obj.view];
[self.window makeKeyAndVisible];
return YES;
}
Run the application to get the output like the one given in the pics below
Some Extra Stuff: Now in the above code lets say when I am finished entering the name then on the hit of the return key I want to vanish the keyboard. The UITextField class has a delegate method to do that and the name of the delegate method is given below
- (BOOL)textFieldShouldReturn:(UITextField *)textField
Select the myviewController.m file and give body to this method
- (BOOL)textFieldShouldReturn:(UITextField *)textField
{
[textField resignFirstResponder];
return YES;
}
Now the textfield should know where its delegate method is right so for doing that we used to write the following code
_inputfield.delegate = self;
which would mean that the delegate for this text field is inside the current class (myviewController) but now we are using the interface builder so things become different and to specify the delegate method for the text field you select the myviewContrroller.xib file and select the text field and right click it, you will get a black popup which will contain a section called as the outlet containing the delegate outlet
So just hook up the delegate outlet with the file owner, because the file oner contains the reference to the myviewController class which contains the delegate method of the UITextfield.
So now if you run the application and enter your name inside the textfield and then hit the return key the keyboard will vanish.
I hope that this post was useful to you in understanding the concepts of the interface builder. Happy iCoding and have a great Day.
Comments
Post a Comment