Multi tool use

Clash Royale CLAN TAG

How can I move the clear button in a UITextField?

For some reason, when I add a UITextfield as a subview of the contentview of a tablecell, the clearbutton does not align with the text typed in the field, and appears a bit underneath it. Is there any way I can move the text of the clearbutton to stop this from happening? Thanks for any help,

6 Answers
6

I haven't seen this, and a screen shot would be helpful. But, the quick answer is that you can inspect the subviews array of the UITextField, find the subview that contains the clear button, and adjust its frame.origin.

Edit: It seems I've been downvoted for this answer (written in 2010). This is of not an "officially" approved method because you're manipulating private objects, but it's not detectable by Apple. The main risk is that the view hierarchy might be changed at some point.

As stated by @Luda the correct way is to subclass UITextField and override - (CGRect)clearButtonRectForBounds:(CGRect)bounds. However the bounds passed in to the method are those of the view itself and not the button. Therefore you should call super to get the OS provided size (to avoid distortion of the image) and then adjust the origin to suit your needs.

- (CGRect)clearButtonRectForBounds:(CGRect)bounds

super

e.g.

- (CGRect)clearButtonRectForBounds:(CGRect)bounds {
CGRect originalRect = [super clearButtonRectForBounds:bounds];
return CGRectOffset(originalRect, -10, 0); //shift the button 10 points to the left
}


Apple docs state:

Discussion You should not call this method directly. If you want to
place the clear button in a different location, you can override this
method and return the new rectangle. Your method should call the super
implementation and modify the returned rectangle’s origin only.
Changing the size of the clear button may cause unnecessary distortion
of the button image.

I had subclassed the UITextField and override the function clearButtonRectForBounds:.

UITextField

clearButtonRectForBounds:

.h

#import <UIKit/UIKit.h>

@interface TVUITextFieldWithClearButton : UITextField

@end


.m

#import "TVUITextFieldWithClearButton.h"

@implementation TVUITextFieldWithClearButton

- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
}
return self;
}

- (void)awakeFromNib
{
self.clearButtonMode = UITextFieldViewModeWhileEditing;
}


- (CGRect)clearButtonRectForBounds:(CGRect)bounds
{
return CGRectMake(bounds.size.width/2-20 , bounds.origin.y-3, bounds.size.width, bounds.size.height);
}

@end


Subclass UITextField and override this method:

- (CGRect)clearButtonRectForBounds:(CGRect)bounds
{
return CGRectMake(bounds.origin.x - 10, bounds.origin.y, bounds.size.width, bounds.size.height);
}


return the CGRect that matches your needs.

Swift 4 version would be

import UIKit

class LoginTextField: UITextField {

override func clearButtonRect(forBounds bounds: CGRect) -> CGRect {
return CGRect(x: xPos, y:yPos, width: yourWidth, height: yourHeight)
}

}


The answer from Van Du Tran in Swift 4:

class CustomTextField: UITextField {


override func clearButtonRect(forBounds bounds: CGRect) -> CGRect {
let originalRect = super.clearButtonRect(forBounds: bounds)

return originalRect.offsetBy(dx: -8, dy: 0)
}


}

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.