Custom UITextField clear button

You can set your own custom clear button to the text field's rightView property. Make sure set the rightViewMode property to UITextFieldViewModeWhileEditing or UITextFieldViewModeAlways, whatever makes sense for your case.

If the button's position isn't right for your need, you can subclass UITextField and override the rightViewRectForBounds: method.

The documentation says the default for the clearButtonMode property is UITextFieldViewModeNever, but I suspect Interface Builder may set it to UITextFieldViewModeWhileEditing - Make sure you set it to the "never" value so it doesn't appear.

All these properties are documented in UITextField Class Reference.


Tested iOS7.0 - 8.4

It is possible to update the backgroundImage of all clear buttons using the following UIAppearance method. Unfortunately you cannot update the image of the button:

UIButton *defaultClearButton = [UIButton appearanceWhenContainedIn:[UITextField class], nil];
[defaultClearButton setBackgroundImage:[UIImage imageNamed:@"clearButtonBkg1.png"] forState:UIControlStateNormal];

Using the following images, this results in the following clear button:

White background image @3x:

White clear button background

enter image description here

Note: This will update the background image of ALL buttons contained in textfields


You can access that property using KVO:

UIButton *clearButton = [myTextField valueForKey:@"_clearButton"];
[clearButton setImage:[UIImage new] forState:UIControlStateNormal];