UIAlertView with UITextField

Note: This blog is deprecated. @synthesize zach has moved to a new home, at zpasternack.org. This blog entry can be found on the new blog here. Please update your links.

---

It's sometimes useful to display an alert with a text box for simple data entry.  It's simple, effective, and is a pretty reasonable UI, in my opinion.  For example, PuzzleTiles does this as kind of a ghetto name entry prompt for adding your name to the high score list.  

Fortunately, Apple provides an API for adding text fields to alert views.  Unfortunately, they're private.  It used to be you could sneak that by the app review team, but those days are over.  Your app will be rejected if you use these calls, take it from me.

Good news, though: manually adding your own text field to an alert view is easy, and fun.  Dig it:

#define kTag_EnterNameAlert  1
#define kTag_NameEmtryField  100

- (void) doAlertWithTextField {
 UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"Congratulations!" 
             message:@"You earned a top score! Enter your name:\n\n"
               delegate:self 
            cancelButtonTitle:nil
            otherButtonTitles:@"OK", nil];
 alert.tag = kTag_EnterNameAlert;
 
 CGRect entryFieldRect = CGRectZero;
 if( UIDeviceOrientationIsPortrait( [UIApplication sharedApplication].statusBarOrientation ) ) {
  entryFieldRect = CGRectMake(12, 90, 260, 25);
 }
 else {
  entryFieldRect = CGRectMake(12, 72, 260, 25);
 }
 
 UITextField *nameEntryField = [[UITextField alloc] initWithFrame:entryFieldRect];
 nameEntryField.tag = kTag_NameEmtryField;
 nameEntryField.backgroundColor = [UIColor whiteColor];
 nameEntryField.keyboardType = UIKeyboardTypeAlphabet;
 nameEntryField.keyboardAppearance = UIKeyboardAppearanceAlert;
 nameEntryField.autocorrectionType = UITextAutocorrectionTypeNo;
 nameEntryField.clearButtonMode = UITextFieldViewModeWhileEditing;
 [alert addSubview:nameEntryField];
 [nameEntryField becomeFirstResponder];
 [nameEntryField release];
 
 [alert show];
 [alert release];
}

You more-or-less make a UITextField and add it to the UIAlertView via addSubview:. There are some things to note, in no particular order:

• Put some extra linefeeds at the end of your message.  This will make the alert view taller, which makes room for the text field.  You'll need to play around with it to get it looking just right.
• You're going to need to hardcode the coordinates of the text field, and depending on the message, the location might need to change.  Again, play with it.  Don't half-ass it; iPhone apps need to be pretty.  Note that if you support landscape mode, the layout will be ever-so-slightly different.
• Set the text field's keyboardAppearance to UIKeyboardAppearanceAlert; otherwise the keyboard will overlap with the alert.
• If you're expecting the user to enter a name, you probably want to turn off autocorrection by setting the text field's autocorrectionType to UITextAutocorrectionTypeNo
• If you intend to do something with the text later, set the text field's tag so you can easily retrieve it later (like, in alertView:willDismissWithButtonIndex;.

The result looks like this: