This is part of an ELC Tech Network

iPhone Coding Tutorial – Inserting A UITextField In A UIAlertView

Screen shot 2009-11-09 at 8.12.11 AM copyThis will be a simple tutorial showing you how to put a UITextField in a UIAlertView. This is simple and just a couple lines if code. You will learn CGAffineTransform and coding UITextField programmatically.

Heres a screenshots of what we should get.

Screen shot 2009-11-09 at 8.12.11 AM

So lets go ahead and get started…

1. Create A New View Based Application
You can name it whatever you want, I am gonna name it TextFieldInAlert.

2. Implementing The Code
Jump in the viewcontroller.m or if you called it TextFieldInAlert then TextFieldInAlert.m Now find the -(void)viewDidLoad method. Uncomment it and put this code in there.

- (void)viewDidLoad {

[super viewDidLoad];

UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@”Enter Name Here” message:@”this gets covered!”

delegate:self cancelButtonTitle:@”Dismiss” otherButtonTitles:@”OK!”, nil];

UITextField *myTextField = [[UITextField alloc] initWithFrame:CGRectMake(12, 45, 260, 25)];

[myTextField setBackgroundColor:[UIColor whiteColor]];

[alert addSubview:myTextField];

[alert show];

[alert release];

[myTextField release];

Advertisement

}

So we are basically calling a UIAlertView and then we are adding the UITextField programmatically. You might have noticed in the message part of the UIAlertView we put “this gets covered!”, if we didn’t put that sentence then the alerts buttons would go up more and the UITextField will be messed. You can try taking that line out and see what happens. Now Build and Run the app. Now you got the UITextField to be inside the UIAlertView. Now try tapping the UITextField. Uh oh, why is the Keyboard covering the UIAlertView? Well there is just a simple fix to this. We just add two more lines of code and it will fix that. Add this to your code

CGAffineTransform myTransform = CGAffineTransformMakeTranslation(0, 60);

[alert setTransform:myTransform];

So now your full code should be looking like this.

UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@”Enter Name Here” message:@”this gets covered!” delegate:self cancelButtonTitle:@”Dismiss” otherButtonTitles:@”OK!”, nil];

UITextField *myTextField = [[UITextField alloc] initWithFrame:CGRectMake(12, 45, 260, 25)];

CGAffineTransform myTransform = CGAffineTransformMakeTranslation(0, 60);

[alert setTransform:myTransform];

[myTextField setBackgroundColor:[UIColor whiteColor]];

[alert addSubview:myTextField];

[alert show];

[alert release];

[myTextField release];

Now if you Build and Run, you will notice the UITextField is a little higher and when you tap the UITextField the Keyboard doesn’t cover it up anymore. That is what the CGAffineTransform was for. So that is basically it! There is a video tutorial also available and if you like video tutorial more then written ones you can check it out out by clicking HERE. You can download the source code below. Happy iCoding!

iPhone Tutorial – UITextField In A UIAlertView

This entry was posted in iPhone Game Programming, iPhone Programming Tutorials. Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

22 Comments

  1. Posted November 9, 2009 at 8:48 pm | Permalink

    Great post dude.. I really expect more tutorials like this!

  2. mOuse
    Posted November 10, 2009 at 2:23 am | Permalink

    Hey, a really useful post!

    Do you think this is in-keeping with Apple’s UI guidelines? I’ve done this for a while in an App, but I recently decided to switch to a modal view because I wasn’t convinced I was doing the right thing. The other reason I switched was that it takes ages for the UI to appear on a non-3gs phone.

    • AppStoreMod
      Posted November 10, 2009 at 9:53 am | Permalink

      No. There is a lot of people that used this in there applications and it was fine with Apple and also it didn’t slow down there app at all. It might be something your doing in your code.

  3. Constantine
    Posted November 10, 2009 at 3:07 am | Permalink

    Hello, I create my own UIAlertView subclass. My class can autoresize to any view.

    http://fryconstantine.habrahabr.ru/blog/74627/

  4. Constantine
    Posted November 10, 2009 at 3:10 am | Permalink

    How Can I post my topic in english on this blog?

  5. john
    Posted November 10, 2009 at 4:13 am | Permalink

    Hi there,

    This is great. Thanks you.

    Could you post a little code to show how to access the value of the text box, say, in a

    - (void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex {

    method.

    Thanks.

  6. Shane
    Posted November 10, 2009 at 6:12 am | Permalink

    Great stuff. Thanks.

  7. mOuse
    Posted November 10, 2009 at 1:33 pm | Permalink

    Yeah maybe… I think it was because I was forcing the keyboard to appear at the same time.

  8. spoonforknife
    Posted November 10, 2009 at 5:13 pm | Permalink

    Rather than adding an extraneous message line, wouldn’t it be better (as long as you’re customizing your UIAlertView) to simply make a custom UIAlertView and override the default setFrame method? This would then allow you to manage the UIAlertView far more easily.

  9. spoonforknife
    Posted November 10, 2009 at 8:31 pm | Permalink

    You also have a memory leak from not releasing the UITextField.

  10. Constantine
    Posted November 10, 2009 at 11:05 pm | Permalink

    try this alert view http://dl.dropbox.com/u/1378133/SmartAlertView.zip/ this alert view can autoresize to any view. you can dispay UITextField, UITableView, UIImageView an etc. Example:

    UIView *myView = [[UIView alloc] initWithCenter:CGPointMake(0,0)];
    SmartAlertView *smartAlertView = [[SmartAlertView alloc] initWithView:myView andTitle:@”JustForFun”
    withTarget:nil andAction:@selector(doSomething:)];
    [smartAlertView show];
    [smartAlertView release];
    [poof release];

    screencast: http://dl.dropbox.com/u/1378133/SmartAlertView.mov

  11. hugo
    Posted November 11, 2009 at 6:26 pm | Permalink

    mayby with animation?

    - (void)viewDidLoad {
    [super viewDidLoad];

    alert = [[UIAlertView alloc] initWithTitle:@”Enter Name Here” message:@”this gets covered!” delegate:self cancelButtonTitle:@”Dismiss” otherButtonTitles:@”OK!”, nil];
    UITextField *myTextField = [[UITextField alloc] initWithFrame:CGRectMake(12, 45, 260, 25)];
    myTextField.delegate = self;

    [myTextField setBackgroundColor:[UIColor whiteColor]];
    [alert addSubview:myTextField];
    [alert show];
    [alert release];
    }

    - (void)textFieldDidBeginEditing:(UITextField *)textField{
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:0.3];

    CGAffineTransform myTransform = CGAffineTransformMakeTranslation(0, -60);
    [alert setTransform:myTransform];

    [UIView commitAnimations];
    }

  12. Chris
    Posted November 13, 2009 at 10:33 am | Permalink

    Can I assume that this method would work with two UITextFields, like if I was implementing a UserName & Password AlertView?

  13. Matt
    Posted November 18, 2009 at 4:52 pm | Permalink

    Great post – thanks.

    Just one question how do you get the value from the text field?

    I have tried adding textFieldDidEndEditing, but i never get in the method.

    I do have ever jump to my -(void)allertView: etc method but can’t then get to my text box value.

    Your help would be much appreciated!

    Thanks!

  14. Matt
    Posted November 18, 2009 at 4:59 pm | Permalink

    Don’t worry I sorted it… just declared the UITextField *myTextField; in the header file and not the alert method code.

    Then used myTextField.text in the alertView method…

    Easy, just needed to use my brain!

  15. Posted November 21, 2009 at 11:12 am | Permalink

    Had a little trouble at first but finally sorted it – many thanks

  16. Posted November 22, 2009 at 4:44 am | Permalink

    Great tutorial nice and simple and right to the point.

    I ran into an issue with this though. If you add a button on the view that brings up the alert with text field you can hold down inside the text field and let go and the ‘paste’ option appears as usual.

    But after the first time if you bring up the alert a second time (and every time thereafter) the paste option no longer works! The little magnifying glass still pops up but when it goes away, there is no paste option!

    Anyone have any idea why this might be?

  17. Alby
    Posted December 22, 2009 at 11:07 am | Permalink

    Great tutorial!
    Can someone help me? I want to use this tutorial to make an option to rename items in my uitableview.

    Thank you

  18. Posted January 21, 2010 at 9:28 pm | Permalink

    Great Tutorial! I was wondering if there is a way to have something displayed after you hit the “OK!” button. Any help would be great. Thanks

  19. Jim
    Posted February 7, 2010 at 5:29 am | Permalink

    I also would like to know what Jeremiah asked.
    Thanks in advance

  20. Posted February 7, 2010 at 8:38 pm | Permalink

    Echt ein informativer Blog, werde sicherlich noch

  21. Posted March 9, 2010 at 4:09 pm | Permalink

    Be aware that though this code may have made it onto the store in the past Apple are being much more strict these days. I recently had an app refused for one reason only and that was because I used this code to put a UITextField in a UIAlertView. Once I stopped using this the app got in the store fine :)

2 Trackbacks

  1. [...] 原文见:iPhone Coding Tutorial – Inserting A UITextField In A UIAlertView   用户界面, 编程   用户界面, 编程, UIAlertView, 教程   [...]

  2. [...] di nuovo anche grazie ai tutorial di iCodeBlog. Inauguriamo questa nuova collaborazione con un tutorial di AppStoreMod che ci mostra come inserire un UITextField all’interno di un UIAlertView. Tutorial molto [...]

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">