Quickly set UITextField icon position

Question

Add icon to UITextField with

var leftImageView = UIImageView() leftImageView.image = leftImage textField.leftView = leftImageView textField.leftViewMode = UITextFieldViewMode.Always leftImageView.frame = CGRectMake(15, 10, 15, 20) textField.addSubview(leftImageView) 

o / p for this

I found a solution similar to removing this code from code

 textField.leftView = leftImageView 

It gives the correct alignment of the icon, but whenever you start editing the text of a text field on an icon like this

I want o / p like this

Answer 1

First of all, you should definitely not add an image as a subroutine to a shortcut. This is enough to set the leftView property.

 textField.addSubview(leftImageView) // Delete this line 

Secondly, any x or y offsets that you apply to the left frame of view are ignored. The text box will only care about the size of the view. If you want to add registration around the image, one option is to use the container view and place the image inside.

 let leftImageView = UIImageView() leftImageView.image = leftImage let leftView = UIView() leftView.addSubview(leftImageView) leftView.frame = CGRectMake(0, 0, 30, 20) leftImageView.frame = CGRectMake(0, 0, 15, 20) textField.leftView = leftView 

Another option would be to subclass UITextField and override leftViewRectForBounds .

Answer 2

Referring to the @hennes syntax, there is a syntax that is not present in swift, since the CGRect syntax changes and userNameTextField.leftViewMode = .always missing

With quick syntax, this worked for me:

  let leftImageView = UIImageView() leftImageView.image = UIImage(named: "email") let leftView = UIView() leftView.addSubview(leftImageView) leftView.frame = CGRect(x: 0, y: 0, width: 40, height: 40) leftImageView.frame = CGRect(x: 10, y: 10, width: 20, height: 20) userNameTextField.leftViewMode = .always userNameTextField.leftView = leftView 

Answer 3

Try it. Can help you.

 var padding: Float = 20 var envelopeView: UIImageView = UIImageView(frame: CGRectMake(padding, 0, 30, 30)) envelopeView.image = UIImage.imageNamed("comment-128.png") envelopeView.contentMode = UIViewContentModeScaleAspectFit var viewLeft: UIView = UIView(frame: CGRectMake(padding, 0, 30, 30)) viewLeft.addSubview(envelopeView) textField.leftView.setFrame(envelopeView.frame) textField.leftView = viewLeft textField.leftViewMode = UITextFieldViewModeAlways var viewRight: UIView = UIView(frame: CGRectMake(textField.frame.size.width - (textField.frame.size.width + 30 + padding), 0, 30, 30)) viewRight.addSubview(envelopeView) textField.rightView.setFrame(envelopeView.frame) textField.rightView = viewRight textField.rightViewMode = UITextFieldViewModeAlways 

Answer 4

Swift 3.1

 extension UITextField { enum Direction { case Left case Right } func AddImage(direction:Direction,imageName:String,Frame:CGRect,backgroundColor:UIColor) { let View = UIView(frame: Frame) View.backgroundColor = backgroundColor let imageView = UIImageView(frame: Frame) imageView.contentMode = .center imageView.image = UIImage(named: imageName) View.addSubview(imageView) if Direction.Left == direction { self.leftViewMode = .always self.leftView = View } else { self.rightViewMode = .always self.rightView = View } } }