UITextField Validation visual feedback

Question

i have a uiTextField that i am validating input on, when i have invalid input what are some appropriate ways to show that the input is invalid? is there any built in mechanism for showing invalid input states?

Answer 1

It's pretty easy to add an 'warning' image to the left-hand side of a UITextField to indicate that the field needs a value.

Try this:

UITextField* field = .... your text field ...

if ( fails_validation ) {
  field.leftViewMode = UITextFieldViewModeAlways;
  UIImageView* imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 32, 32)];
  imageView.image = [UIImage imageNamed:@"warning.png"];
  imageView.contentMode = UIViewContentModeScaleAspectFit;
  field.leftView = imageView;
} else {
  field.leftViewMode = UITextFieldViewModeNever;
  field.leftView = nil;
}

Answer 2

The best two options I've found so far are TextFieldValidator and US2FormValidator. With the caveat that I have only used the former, here's my take on each.

TextFieldValidator

• ↑ Simple (just one class!)
• ↑ Offers default UI with additional customization possible
• ↑ Handles multiple validations on a single field
• ↓ Doesn't handle text views
• ↓ Slightly awkward name…ValidatedTextField, for example, would be more accurate :)

US2FormValidator

• ↑ Handles text fields and text views
• ↑ Importable as a framework, including CocoaPods support
• ↑ Handles multiple validations on a single field
• ↓ No default UI

If you just need something implemented quickly, TextFieldValidator may be all you need. If you must have validated UITextViews, US2FormValidator is the way to go.

Answer 3

Have a look at Managing Overlay Views section in UITextField docs

Answer 4

Put a check mark to the right of the UITextField when correct, Else put an X to the right of it. to make it look smooth: fade it using an animation