Pyae Phyoe Shein
Pyae Phyoe Shein

Reputation: 13827

Show error icon automatically in UITextField when validation is failed in swift

I want error icon image will be shown automatically within UITextField when one of validation is failed in swift.

Here is normal stage enter image description here

Here is error stage when validation is failed enter image description here

For that UITextField, I've created custom UITextField as follow

class OvalTextField: UITextField {

    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)!
        createBorder()
    }

    required override init(frame: CGRect) {
        super.init(frame: frame)
        createBorder()
    }

    func createBorder(){

        let errorImg = UIImageView (frame: CGRectMake(0, 0, 30, 30))
        errorImg.image = UIImage(named: "error")
        errorImg.contentMode = UIViewContentMode.Left

        self.layer.borderWidth = 1.0
        self.layer.borderColor = UIColor(red:0.93, green:0.93, blue:0.93, alpha:1.0).CGColor
        self.layer.cornerRadius = self.frame.size.height / 2
        self.layer.masksToBounds = true

        let gapLabel = UIView (frame: CGRectMake(60, 0, 10, 40))
        self.leftView = gapLabel
        self.leftViewMode = UITextFieldViewMode.Always

        /* Display that one when validation is failed */
        self.rightView = errorImg;
        self.rightViewMode = UITextFieldViewMode.Always
    }
}

and used that UITextField in ViewController,

@IBOutlet var txtEmail: OvalTextField!

if that txtEmail is empty or not valid email address, I want to show error icon message.

Please suggest me how to do it. Thanks in advance.

Upvotes: 6

Views: 10103

Answers (2)

Raish Khan
Raish Khan

Reputation: 81

func validated() -> Bool {
    var valid: Bool = true
    if ((txt_EmailID.text?.isEmpty) != nil){
        // change placeholder color to red color for textfield email-id
        txt_EmailID.attributedPlaceholder = NSAttributedString(string: "Please enter Your Email ID", attributes: [NSForegroundColorAttributeName: UIColor.redColor()])
        valid = false
    }
    if ((txt_UserName.text?.isEmpty) != nil){
        // change placeholder color to red for textfield username
        txt_UserName.attributedPlaceholder = NSAttributedString(string:"Please enter User Name",attributes: [NSForegroundColorAttributeName: UIColor.redColor()])
        valid = false
    }
    if ((txt_Password.text?.isEmpty) != nil){
        // change placeholder color to red for textfield password
        txt_Password.attributedPlaceholder = NSAttributedString(string:"Please enter Password",attributes: [NSForegroundColorAttributeName:UIColor.redColor()])
        valid = false
    }
    if ((txt_MobileNo.text?.isEmpty) != nil){
        // change placeholder color to red for textfield mobile no.
        txt_MobileNo.attributedPlaceholder = NSAttributedString(string: "Please enter Mobile no.",attributes: [NSForegroundColorAttributeName: UIColor.redColor()])
        valid = false
    }
    return valid
}

Upvotes: 3

EricXuan
EricXuan

Reputation: 387

You can use the UITextFiledDelegate method func textField(textField: UITextField, shouldChangeCharactersInRange range: NSRange, replacementString string: String) -> Bool to valid the email when user input.

  1. First set the delegate, txtEmail.delegate = self, then
  2. Implement the delegate method

    func textField(textField: UITextField, shouldChangeCharactersInRange  range: NSRange, replacementString string: String) -> Bool {
    
        let email = (textField.text! as NSString).stringByReplacingCharactersInRange(range, withString: string)
    
        if /* email is validate */ {
            textField.rightView?.hidden = false
        } else {
            textField.rightView?.hidden = true
        }
    
        return true
    

    }

Upvotes: 6

Related Questions