Swift: how to create an image on the left side of a text field?

Question

I have got a text field:

let usn_text_field: UITextField = {
        let tf = UITextField()
        tf.placeholder = "Username"
        tf.translatesAutoresizingMaskIntoConstraints = false
        tf.background = #imageLiteral(resourceName: "usericon2")
        return tf
    }()

This textfield shows an input field with an image expanded. But I want a simple icon on the left of the input, how can i resize and reposition the image?

See this question: [Swift add icon/image in UITextField](https://stackoverflow.com/questions/27903500/swift-add-icon-image-in-uitextfield) — Anh Pham, Jul 20 '17 at 14:07

Tamás Sengel · Accepted Answer · 2017-07-20T14:13:29.283

6

Use the leftView attribute of the text field and put a UIImageView there to place an image to the left side of your text field.

tf.leftView = UIImageView(image: #imageLiteral(resourceName: "usericon2"))

If you want to show it always, change the leftViewMode property of the text field:

tf.leftViewMode = .always

edited Jul 20 '17 at 14:13

answered Jul 20 '17 at 14:05

Tamás Sengel

55,884
29
169
223

But what about size? It's still big – sakoaskoaso Jul 20 '17 at 14:07
You can resize it by changing its `frame`. – Tamás Sengel Jul 20 '17 at 14:08
Okay,thanks for thy answers.I shall accept it as soon as stackoverflow lets me:) – sakoaskoaso Jul 20 '17 at 14:09

kamwysoc · Answer 2 · 2017-07-20T14:09:03.657

3

You can use leftView property of UITextField

let textField : UITextField = UITextField()
textField.leftView = UIImageView(image: UIImage(named: "your_image"))
textField.leftViewMode = .always

edited Jul 20 '17 at 14:09

answered Jul 20 '17 at 14:05

kamwysoc

6,709
2
34
48

Thanks for your heuristic answer,but i think you forgot about `tf.leftViewMode = .always`,my code didn't work without it. – sakoaskoaso Jul 20 '17 at 14:08

Swift: how to create an image on the left side of a text field?

2 Answers2