198

How do you add that little "X" button on the right side of a UITextField that clears the text? I can't find an attribute for adding this sub-control in Interface Builder in the iPhone OS 2.2 SDK.

Note: In Xcode 4.x and later (iPhone 3.0 SDK and later), you can do this in Interface Builder.

Improve this question

11 Answers 11

Reset to default
376

This button is a built-in overlay that is provided by the UITextField class, but as of the iOS 2.2 SDK, there isn't any way to set it via Interface Builder. You have to enable it programmatically.

Add this line of code somewhere (viewDidLoad, for example):

Objective-C

myUITextField.clearButtonMode = UITextFieldViewModeWhileEditing;

Swift 5.0

myUITextField.clearButtonMode = .whileEditing
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

66

You can also set this directly from Interface Builder under the Attributes Inspector.

enter image description here

Taken from XCode 5.1

Improve this answer

1 Comment

Note that the question specifically asks about the 2.2 SDK, and notes that this option is available in Interface Builder in later versions.
51

Swift 4+:

textField.clearButtonMode = UITextField.ViewMode.whileEditing

or even shorter:

textField.clearButtonMode = .whileEditing
Improve this answer

1 Comment

Fix enum type. Must not start from capital letter.
35

you can add custom clear button and control the size and every thing using this:

UIButton *clearButton = [UIButton buttonWithType:UIButtonTypeCustom]; [clearButton setImage:img forState:UIControlStateNormal]; [clearButton setFrame:frame]; [clearButton addTarget:self action:@selector(clearTextField:) forControlEvents:UIControlEventTouchUpInside]; textField.rightViewMode = UITextFieldViewModeAlways; //can be changed to UITextFieldViewModeNever, UITextFieldViewModeWhileEditing, UITextFieldViewModeUnlessEditing [textField setRightView:clearButton];
Improve this answer

Comments

8

Swift 4 (adapted from Kristopher Johnson's answer)

textfield.clearButtonMode = .always textfield.clearButtonMode = .whileEditing textfield.clearButtonMode = .unlessEditing textfield.clearButtonMode = .never
Improve this answer

Comments

8

Objective C :

self.txtUserNameTextfield.myUITextField.clearButtonMode = UITextFieldViewModeWhileEditing;

Swift :

txtUserNameTextfield.clearButtonMode = UITextField.ViewMode.WhileEditing;
Improve this answer

Comments

7

this don't work, do like me:

swift:

customTextField.clearButtonMode = UITextField.ViewMode.Always customTextField.clearsOnBeginEditing = true; func textFieldShouldClear(textField: UITextField) -> Bool { return true }
Improve this answer

Comments

7

On Xcode 8 (8A218a):

Swift: 

textField.clearButtonMode = UITextField.ViewMode.whileEditing;

The "W" went from capital to non-cap "w".

Improve this answer

Comments

1 
 func clear_btn(box_is : UITextField){ box_is.clearButtonMode = .always if let clearButton = box_is.value(forKey: "_clearButton") as? UIButton { let templateImage = clearButton.imageView?.image?.withRenderingMode(.alwaysTemplate) clearButton.setImage(templateImage, for: .normal) clearButton.setImage(templateImage, for: .highlighted) clearButton.tintColor = .white } }
Improve this answer

Comments

1

Use below lines of code. If rightView is there clear button is not showing.

self.txtField.rightView = nil self.txtField.rightViewMode = .never self.txtField.clearButtonMode = UITextField.ViewMode.always
Improve this answer

Comments

-4

On Xcode Version 8.1 (8B62) it can be done directly in Attributes Inspector. Select the textField and then choose the appropriate option from Clear Button drop down box, which is located in Attributes Inspector.

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.