Make Better Things



I like to make better things.

Add UITextField in UIAlertView

Hello All, here’s my experience with adding a UITextField to a UIAlertView. All of this is done in code, so there’s no interface builder(IB) to handle the layout.

Adding a UITextField to a UIAlertView is as simple as inistantiating the UITextField and adding it as a subview of your UIAlertView. I set eh background color of the test field to be white so you can see where it is.

UIAlertView *myAlertView = [[UIAlertView alloc] initWithTitle:nil message:nil delegate:self cancelButtonTitle:@"Cancel" otherButtonTitles:nil];
UITextField *myTextField = [[UITextField alloc] initWithFrame:CGRectMake(12.0, 45.0, 260.0, 25.0)];
[myAlertView addSubview:myTextField];
[myAlertView show];
[myAlertView release];

Here’s a pic of the abboration that is your custom UIAlertView thus far.

Add UITextField in UIAlertView - 1

Add UITextField in UIAlertView -1

After fiddling around with all the values for a while, I finally found the proper settings that allow the alert view to be displayed properly with the text field fully visible and functional. Since the UIAlertView isn’t “made” to support this type of user interaction, you have to specify a message component for the alert view. This provides enough spacing so that you can insert the text field which will cover the message and thus keep things from over lapping. Here’s the revised code and a picture of the properly formatted UIAlertView.

UIAlertView *myAlertView = [[UIAlertView alloc] initWithTitle:@"Your title here!" message:@"this gets covered" delegate:self cancelButtonTitle:@"Cancel" otherButtonTitles:@"OK", nil];
UITextField *myTextField = [[UITextField alloc] initWithFrame:CGRectMake(12.0, 45.0, 260.0, 25.0)];
[myTextField setBackgroundColor:[UIColor whiteColor]];
[myAlertView addSubview:testTextField];
[myAlertView show];
[myAlertView release];
Add UITextField in UIAlertView - 2

Add UITextField in UIAlertView - 2

After getting all that done, I ran into one more problem. When you touch the text field to enter text, the keyboard slides into view and covers part of the alert view.

Add UITextField in UIAlertView - 3

Add UITextField in UIAlertView - 3

To fix this, I created a translation transform and applied it to the alert view to move it higher up the screen so it wouldn’t interfere with the keyboard. With that done, this is what it looks like. You still need to set up delegate methods for the alert view and the text field, but those are pretty simple and straight forward.

UIAlertView *myAlertView = [[UIAlertView alloc] initWithTitle:@"Your title here!" message:@"this gets covered" delegate:self cancelButtonTitle:@"Cancel" otherButtonTitles:@"OK", nil];
UITextField *myTextField = [[UITextField alloc] initWithFrame:CGRectMake(12.0, 45.0, 260.0, 25.0)];
[myTextField setBackgroundColor:[UIColor whiteColor]];
[myAlertView addSubview:testTextField];
CGAffineTransform myTransform = CGAffineTransformMakeTranslation(0.0, 130.0);
[myAlertView setTransform:myTransform];
[myAlertView show];
[myAlertView release];
Add UITextField in UIAlertView - 4

Add UITextField in UIAlertView - 4

Category: iPhone

Tagged:

One Response

Leave a Reply