CODEWITHSUNDEEP
iosuitextfield
manuelBetancurt
manuelBetancurt

Reputation: 16128

UITextField clearButtonMode color

can I change the color of the clearButtonMode on a textField?

theTextField.clearButtonMode = UITextFieldViewModeWhileEditing

shows an x that is grey dark color to delete the textField,

but can i show this button with white color?

thanks

Upvotes: 16

Views: 22429

Answers (6)

Dian
Dian

Reputation: 155

yourTextField.overrideUserInterfaceStyle = .dark

Upvotes: 3

Tony Macaren
Tony Macaren

Reputation: 457

Swift 4.1 version

extension UITextField {
    func modifyClearButtonWithImage(image : UIImage) {
        let clearButton = UIButton(type: .custom)
        clearButton.setImage(image, for: .normal)
        clearButton.frame = CGRect(x: 0, y: 0, width: 40, height: 40)
        clearButton.contentMode = .scaleAspectFit
        clearButton.addTarget(self, action: #selector(UITextField.clear(sender:) ), for: .touchUpInside)
        self.rightView = clearButton
        self.rightViewMode = .whileEditing
    }

    @objc func clear(sender : AnyObject) {
        self.text = ""
        sendActions(for: .editingChanged)
    }
}

Upvotes: 5

Mohammad Sadiq
Mohammad Sadiq

Reputation: 5241

Swift version : 

extension UITextField {

    func modifyClearButtonWithImage(image : UIImage) {
        let clearButton = UIButton(type: .Custom)
        clearButton.setImage(image, forState: .Normal)
        clearButton.frame = CGRectMake(0, 0, 40, 40)
        clearButton.contentMode = .ScaleAspectFit
        clearButton.addTarget(self, action: #selector(UITextField.clear(_:)), forControlEvents: .TouchUpInside)
        self.rightView = clearButton
        self.rightViewMode = .WhileEditing
    }

    func clear(sender : AnyObject) {
        self.text = ""
    }

}

Upvotes: 7

Sayali Shinde
Sayali Shinde

Reputation: 96

At the time you're configuring the textField, use:

let clearButton : UIButton = textField.value(forKey: "_clearButton") as! UIButton
let image = UIImage(named: "ClearWhite")

clearButton.setImage(image, for: .normal)
clearButton.backgroundColor = UIColor.clear

Upvotes: 3

mukaissi
mukaissi

Reputation: 2471

A cleaner way is to implement a category on UITextField with this method:

- (void)modifyClearButtonWithImage:(UIImage *)image {
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setImage:image forState:UIControlStateNormal];
    [button setFrame:CGRectMake(0.0f, 0.0f, 15.0f, 15.0f)];
    [button addTarget:self action:@selector(clear:) forControlEvents:UIControlEventTouchUpInside];
    self.rightView = button;
    self.rightViewMode = UITextFieldViewModeWhileEditing;
}

-(IBAction)clear:(id)sender{
    self.text = @"";
}

Upvotes: 8

Ben Harris
Ben Harris

Reputation: 5674

You'll need to create your own clear button image in this case. I would suggest taking a screenshot of the clear button and editing in photoshop.

You can take that image and create a UIButton with the image dimensions. From there you can set it as the UITextField's rightView. Like so:

UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setImage:[UIImage imageNamed:@"clear_button.png"] forState:UIControlStateNormal];
[button setFrame:CGRectMake(0.0f, 0.0f, 15.0f, 15.0f)]; // Required for iOS7
theTextField.rightView = button;
theTextField.rightViewMode = UITextFieldViewModeWhileEditing;

I typed that without syntax checking and what not so you'll want to check it out before running it. You'll also want to replace clear_button.png with whatever your image name is.

You'll also need to write your own method to clear the text field.

Upvotes: 33

Related Questions