Today we are going to begin looking at using some of the controls available to us in xCode.  The first of these tools is the textbox and keyboard.

Using the textbox is very intuitive for most users, but it may require a little programming on your part to get everything to work the way the user (and Apple!) expects.

We will being a new project for this example.  I am calling mine Textbox.  This is a standard View-Based application.  You can of course do this as either an iPhone or iPad project.

First, a few things to consider:

To begin with, add the following lines to your TextboxViewController.h file:
@interface Control_FunViewController : UIViewController {

UITextField  *nameField;

UITextField  *numberField;

}

@property (nonatomic, retain) IBOutlet UITextField *nameField;

@property (nonatomic, retain) IBOutlet UITextField *numberField;

@end

And to your .m file add:

@synthesize nameField;

@synthesize numberField;

Don’t for get to release both of these:

– (void)dealloc {
[nameField release];
[numberField release];
[super dealloc];

IB

After saving both files, open up the IB and add two labels and two textfields.  The labels will only be used as identifiers, which is why they don’t have an IBOutlet associated with them.
Put the two labels on the left of the view, one below the other.  Then place two textfields on the view, each one across from a label.  Go ahead and put “Name” and “Number” in the two labels.

The textfield has a variety of options available.  In this case we are going to use the ‘placeholder’ to give the user instructions as to what should be entered into the textfield.  Type in “Enter Your Name” and “Enter Your Number”.
[tubepress video=heaLPkBsbpQ]

Now, connect the name textfield to the file owner and select “nameField”. Repeat for the number field selecting “numberField”.

Build and Run.  You should be able to enter name and number information into the fields.  But there is a problem, isn’t there?  The keyboard won’t go away!

[tubepress video=xVk7YI0qCZQ]

First, let’s give the app the ability to dismiss the keyboard.  In the header (.h) file add:

– (IBAction)doneEditing:(id)sender;

In the main (.m) file, add:

[sender resignFirstResponder];

}

Now in the IB, select the nameField, open the connections (Command-2) and connect Did End On Exit with the File Owner.  Select doneEditing.  Repeat for numberField.

Now when you Build & Run, the keyboard will dismiss from the name field when you click on Return. But there is no Return button for the number field.  We need another method to dismiss the keyboard.

Add to the header file:

– (IBAction) backgroundClick:(id)sender;

To the main file:

– (IBAction)backgroundClick:(id)sender {

[nameField resignFirstResponder];

[numberField resignFirstResponder];

}

Open the IB.  Place a button in the top left corner of your view, then resize it to fill the view.  Then select ‘Touch Up Inside’ and connect it to the File Owner and select backgroundClick.

Now under the Tools menu, select send to back.

Go ahead and Build & Run.  Now when you click outside the textfields, the keyboard is dismissed!