Fügen Sie schnell ein Symbol / Bild in UITextField hinzu

101

Ich möchte ein Symbol / Bild in UITextField hinzufügen. Das Symbol / Bild sollte dem Platzhalter überlassen bleiben.

Geben Sie hier die Bildbeschreibung ein

Ich habe es versucht:

var imageView = UIImageView();
var image = UIImage(named: "email.png");
imageView.image = image;
emailField.leftView = imageView;

Vielen Dank.

Informatiker
quelle
74
Sie haben versehentlich Semikolons hinzugefügt: D
Gerald
10
emailField.leftView = UIImageView(image: UIImage(named: "search")):)
Tspentzas
Mit @IBDesignablekönnen wir dies auf elegante Weise tun, wie in diesem Beispiel: stackoverflow.com/a/51841433/8238512
Rizwan

Antworten:

120

Versuchen Sie es hinzuzufügen emailField.leftViewMode = UITextFieldViewMode.Always

(Standard leftViewModeist Never)

Aktualisierte Antwort für Swift 4

emailField.leftViewMode = UITextFieldViewMode.always

emailField.leftViewMode = .always
Markus
quelle
Hmm, es hat bei mir funktioniert, hast du es mit dem aktualisierten Wert ( UITextFieldViewMode.Always) versucht ? Haben Sie eine Vorstellung davon, was nicht funktioniert hat? (Hat es zum Beispiel kompiliert?)
Markus
Dies ist mein ganzer Code im Abschnitt 'ViewWillAppear': 'var imageView = UIImageView (); var image = UIImage (benannt: "email.png"); imageView.image = image; emailTextField.leftView = imageView; emailTextField.leftViewMode = UITextFieldViewMode.Always
informatiker
@informatiker Ok, sind Sie sicher, dass Sie die richtigen Verbindungen haben, wenn Sie zum Beispiel die Hintergrundfarbe von einstellen, emailTextFieldändert sich das wirklich? Und bist du sicher, dass das Bild da ist? Erstellen Sie beispielsweise eine andere UIImageView und laden Sie die imagein diese, um zu überprüfen, ob dies funktioniert.
Markus
4
ja dank. Das Problem war, dass das Symbol weiß war und auf weißem Hintergrund nicht sichtbar war.
Informatiker
5
Ich setzte meine Suche fort und brachte es schließlich zum Laufen. Ich vermisste es, den Rahmen für die Bildansicht einzurichten. Es sieht so aus, als müssten wir den Rahmen für das Bild festlegen, bevor wir es dem uitext-Feld hinzufügen. So etwas wie dasimageView1.frame = CGRect(x: 5, y: 0, width: userName.frame.height, height: userName.frame.height) view.addSubview(imageView1)
Sashi
123

Sahil hat eine großartige Antwort, und ich wollte sie in ein @IBDesignable erweitern, damit Entwickler ihren UITextFields im Storyboard Bilder hinzufügen können.

Swift 4.2

import UIKit

@IBDesignable
class DesignableUITextField: UITextField {
    
    // Provides left padding for images
    override func leftViewRect(forBounds bounds: CGRect) -> CGRect {
        var textRect = super.leftViewRect(forBounds: bounds)
        textRect.origin.x += leftPadding
        return textRect
    }
    
    @IBInspectable var leftImage: UIImage? {
        didSet {
            updateView()
        }
    }
    
    @IBInspectable var leftPadding: CGFloat = 0
    
    @IBInspectable var color: UIColor = UIColor.lightGray {
        didSet {
            updateView()
        }
    }
    
    func updateView() {
        if let image = leftImage {
            leftViewMode = UITextField.ViewMode.always
            let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
            imageView.contentMode = .scaleAspectFit
            imageView.image = image
            // Note: In order for your image to use the tint color, you have to select the image in the Assets.xcassets and change the "Render As" property to "Template Image".
            imageView.tintColor = color
            leftView = imageView
        } else {
            leftViewMode = UITextField.ViewMode.never
            leftView = nil
        }
        
        // Placeholder text color
        attributedPlaceholder = NSAttributedString(string: placeholder != nil ?  placeholder! : "", attributes:[NSAttributedString.Key.foregroundColor: color])
    }
}

Was passiert hier?

Mit diesem Design können Sie:

  • Stellen Sie links ein Bild ein
  • Fügen Sie zwischen dem linken Rand des UITextField und dem Bild einen Abstand hinzu
  • Stellen Sie eine Farbe so ein, dass das Bild und der Platzhaltertext übereinstimmen

Anmerkungen

  • Damit sich die Bildfarbe ändert, müssen Sie diesen Hinweis im Kommentar im Code befolgen
  • Die Bildfarbe ändert sich im Storyboard nicht. Sie müssen das Projekt ausführen, um die Farbe im Simulator / Gerät zu sehen.

Im Storyboard gestaltbar Storyboard

Zur Laufzeit Laufzeit

Mark Moeykens
quelle
5
In imageView.contentMode = .AspectFit hinzugefügt, um eine Größenänderung des Bildes zu vermeiden.
Jerland2
3
Vielen Dank für den tollen Beitrag! Ich habe es geändert, um auch eine RTL-Option zu haben. Code hier verfügbar: pastebin.com/7CCm6NEB
Ali Almohsen
Gute Arbeit, Leute! Ich hatte später auch das Gleiche getan. Ha ha
Mark Moeykens
14
Was ist mit dem Auffüllen zwischen Bild und Text?
Zaporozhchenko Oleksandr
1
die große Antwort.
Ripa Saha
51

Ich möchte hier nur noch etwas hinzufügen:

Wenn Sie das Bild UITextFieldauf der linken Seite hinzufügen möchten, verwenden Sie die leftViewEigenschaft vonUITextField

HINWEIS: Vergessen Sie nicht, Satz leftViewModezu UITextFieldViewMode.Alwaysund für Recht rightViewModezu UITextFieldViewMode.Always andStandard istUITextFieldViewModeNever

für zB

Zum Hinzufügen eines Bildes auf der linken Seite

textField.leftViewMode = UITextFieldViewMode.Always
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
let image = UIImage(named: imageName)
imageView.image = image
textField.leftView = imageView

Zum Hinzufügen eines Bildes auf der rechten Seite

textField.rightViewMode = UITextFieldViewMode.Always
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
let image = UIImage(named: imageName)
imageView.image = image
textField.rightView = imageView

HINWEIS: Einige Dinge, die Sie beachten müssen, wenn Sie ein Bild UITextFieldauf der linken oder rechten Seite hinzufügen .

  • Vergessen Sie nicht, einen Rahmen anzugeben, den ImageViewSie hinzufügen möchtenUITextField

    let imageView = UIImageView (Rahmen: CGRect (x: 0, y: 0, Breite: 20, Höhe: 20))

  • Wenn Ihr Bildhintergrund weiß ist, ist das Bild auf nicht sichtbar UITextField

  • Wenn Sie der bestimmten Position ein Bild hinzufügen möchten, müssen Sie es ImageViewals Unteransicht von hinzufügen UITextField.

Update für Swift 3.0

@ Mark Moeykens Wunderschön ausgegeben und @IBDesignable machen .

Ich habe hier einige weitere Funktionen geändert und hinzugefügt (Bottom Line und Polsterung für das rechte Bild hinzufügen).

HINWEIS Wenn Sie ein Bild auf der rechten Seite hinzufügen möchten, können Sie die Force Right-to-LeftOption im semanticInterface Builder auswählen (das Auffüllen der richtigen Bilder funktioniert jedoch erst, wenn Sie die rightViewRect-Methode überschreiben).

Geben Sie hier die Bildbeschreibung ein

Ich habe dies geändert und kann die Quelle von hier ImageTextField herunterladen

Geben Sie hier die Bildbeschreibung ein

Sahil
quelle
Wie kann ich dies in Erweiterungen hinzufügen und meinen Viewcontroller aufrufen?
Können
Sehr einfach! Erstellen Sie einfach eine Funktion in der UIViewController-Erweiterung und übergeben Sie beim Aufrufen dieser Funktion den Bildnamen und die Textfeldreferenz.
Sahil
Erweiterung UIViewController {func addLeftImage (imageName: String, textField: UITextField) {textField.leftViewMode = UITextFieldViewMode = UIImage (benannt: imageName) imageView.image = image textField.leftView = imageView}} und nenne es wie self.addLeftImage ("imganame", textField: yourtextfield)
Sahil
Ich habe versucht, die Symbolposition zu ändern. aber nicht mit diesem Code geändert
Rahul Phate
22

UITextField mit Bild (links oder rechts)

Ein anderer Weg, inspiriert von früheren Beiträgen, um eine Erweiterung vorzunehmen.

Wir können das Bild rechts oder links platzieren

extension UITextField {

enum Direction {
    case Left
    case Right
}

// add image to textfield
func withImage(direction: Direction, image: UIImage, colorSeparator: UIColor, colorBorder: UIColor){
    let mainView = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 45))
    mainView.layer.cornerRadius = 5

    let view = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 45))
    view.backgroundColor = .white
    view.clipsToBounds = true
    view.layer.cornerRadius = 5
    view.layer.borderWidth = CGFloat(0.5)
    view.layer.borderColor = colorBorder.cgColor
    mainView.addSubview(view)

    let imageView = UIImageView(image: image)
    imageView.contentMode = .scaleAspectFit
    imageView.frame = CGRect(x: 12.0, y: 10.0, width: 24.0, height: 24.0)
    view.addSubview(imageView)

    let seperatorView = UIView()
    seperatorView.backgroundColor = colorSeparator
    mainView.addSubview(seperatorView)

    if(Direction.Left == direction){ // image left
        seperatorView.frame = CGRect(x: 45, y: 0, width: 5, height: 45)
        self.leftViewMode = .always
        self.leftView = mainView
    } else { // image right
        seperatorView.frame = CGRect(x: 0, y: 0, width: 5, height: 45)
        self.rightViewMode = .always
        self.rightView = mainView
    }

    self.layer.borderColor = colorBorder.cgColor
    self.layer.borderWidth = CGFloat(0.5)
    self.layer.cornerRadius = 5
}

}

Verwenden :

if let myImage = UIImage(named: "my_image"){
    textfield.withImage(direction: .Left, image: myImage, colorSeparator: UIColor.orange, colorBorder: UIColor.black)
}

Genießen :)

Insou
quelle
1
Du hast meinen Tag gemacht, ich habe die "view.backgroundColor" und die "imageView.tintColor" angepasst, um sie vollständig anpassbar zu machen. Vielen Dank für Ihre Antwort xD
Andres Paladines
1
Das ist großartig
Mohamed Haseel
1
Dies ist die beste und einfachste Antwort
Gerardo Salazar Sánchez
14

Um eine Auffüllung zu erstellen, platziere ich das Bild gerne in einer Containeransicht. Sie können die Hintergrundfarbe entfernen, sobald Sie mit der Platzierung der Symbole zufrieden sind.

Geben Sie hier die Bildbeschreibung ein

let imageView = UIImageView(frame: CGRect(x: 8.0, y: 8.0, width: 24.0, height: 24.0))
let image = UIImage(named: "my_icon")
imageView.image = image
imageView.contentMode = .scaleAspectFit
imageView.backgroundColor = UIColor.red

let view = UIView(frame: CGRect(x: 0, y: 0, width: 32, height: 40))
view.addSubview(imageView)
view.backgroundColor = .green
textField.leftViewMode = UITextFieldViewMode.always
textField.leftView = view
S Yoshida
quelle
Danke dir. Gute Erklärung mit Farben.
Hamid Reza Ansari
13

Fügen Sie für Swift 3.0 ein Bild auf der linken Seite von textField hinzu

textField.leftView = UIImageView(image: "small-calendar")
textField.leftView?.frame = CGRect(x: 0, y: 5, width: 20 , height:20)
textField.leftViewMode = .always
Maulik Patel
quelle
6

Swift 5

@IBOutlet weak var paswd: UITextField! {
    didSet{
      paswd.setLeftView(image: UIImage.init(named: "password")!)
      paswd.tintColor = .darkGray
      paswd.isSecureTextEntry = true
    }   
 }

Ich habe eine Erweiterung erstellt

extension UITextField {
  func setLeftView(image: UIImage) {
    let iconView = UIImageView(frame: CGRect(x: 10, y: 10, width: 25, height: 25)) // set your Own size
    iconView.image = image
    let iconContainerView: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 35, height: 45))
    iconContainerView.addSubview(iconView)
    leftView = iconContainerView
    leftViewMode = .always
    self.tintColor = .lightGray
  }
}

Ergebnis

Geben Sie hier die Bildbeschreibung ein

Gurjinder Singh
quelle
3

Ich habe ein einfaches IBDesignable erstellt. Benutze es wie du willst. Lassen Sie einfach Ihr UITextField diese Klasse bestätigen.

import UIKit

@IBDesignable
class RoundTextField : UITextField {
    @IBInspectable var cornerRadius : CGFloat = 0{
        didSet{
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = cornerRadius > 0
        }
    }

    @IBInspectable var borderWidth : CGFloat = 0 {
        didSet{
            layer.borderWidth = borderWidth
        }
    }

    @IBInspectable var borderColor : UIColor? {
        didSet {
            layer.borderColor = borderColor?.cgColor
        }
    }

    @IBInspectable var bgColor : UIColor? {
        didSet {
            backgroundColor = bgColor
        }
    }

    @IBInspectable var leftImage : UIImage? {
        didSet {
            if let image = leftImage{
                leftViewMode = .always
                let imageView = UIImageView(frame: CGRect(x: 20, y: 0, width: 20, height: 20))
                imageView.image = image
                imageView.tintColor = tintColor
                let view = UIView(frame : CGRect(x: 0, y: 0, width: 25, height: 20))
                view.addSubview(imageView)
                leftView = view
            }else {
                leftViewMode = .never
            }

        }
    }

    @IBInspectable var placeholderColor : UIColor? {
        didSet {
            let rawString = attributedPlaceholder?.string != nil ? attributedPlaceholder!.string : ""
            let str = NSAttributedString(string: rawString, attributes: [NSForegroundColorAttributeName : placeholderColor!])
            attributedPlaceholder = str
        }
    }

    override func textRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.insetBy(dx: 50, dy: 5)
    }

    override func editingRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.insetBy(dx: 50, dy: 5)
    }

}
Abhishek Biswas
quelle
3

Geben Sie hier die Bildbeschreibung ein
Eine andere Möglichkeit, das Platzhaltersymbol und die Auffüllung auf TextField festzulegen.

let userIcon = UIImage(named: "ImageName") 
setPaddingWithImage(image: userIcon, textField: txtUsername)

func setPaddingWithImage(image: UIImage, textField: UITextField){
    let imageView = UIImageView(image: image)
    imageView.contentMode = .scaleAspectFit
    let view = UIView(frame: CGRect(x: 0, y: 0, width: 60, height: 50))
    imageView.frame = CGRect(x: 13.0, y: 13.0, width: 24.0, height: 24.0)
    //For Setting extra padding other than Icon.
    let seperatorView = UIView(frame: CGRect(x: 50, y: 0, width: 10, height: 50))
    seperatorview.backgroundColor = UIColor(red: 80/255, green: 89/255, blue: 94/255, alpha: 1)
    view.addSubview(seperatorView)
    textField.leftViewMode = .always
    view.addSubview(imageView)
    view.backgroundColor = .darkGray
    textField.leftViewMode = UITextFieldViewMode.always
    textField.leftView = view
}
Sudhi 9135
quelle
3

2020 - vernünftige Lösung

In Bezug auf diesen Wahnsinn von Apple.

Hier ist vielleicht der "klarste", einfachste Weg, dies zu tun:

Geben Sie hier die Bildbeschreibung ein

Zunächst müssen Sie den Text korrekt verschieben.

Beachten Sie diese wichtige Qualitätssicherung: https://stackoverflow.com/a/27066764/294884

class TidyTextField: UITextField {
    
    @IBInspectable var leftImage: UIImage? = nil
    @IBInspectable var leftPadding: CGFloat = 0
    @IBInspectable var gapPadding: CGFloat = 0
    
    private var textPadding: UIEdgeInsets {
        let p: CGFloat = leftPadding + gapPadding + (leftView?.frame.width ?? 0)
        return UIEdgeInsets(top: 0, left: p, bottom: 0, right: 5)
    }
    
    override open func textRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.inset(by: textPadding)
    }
    
    override open func placeholderRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.inset(by: textPadding)
    }
    
    override open func editingRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.inset(by: textPadding)
    }
    

Weiter müssen wir nun das linke Bild machen und verschieben:

    override func leftViewRect(forBounds bounds: CGRect) -> CGRect {
        var r = super.leftViewRect(forBounds: bounds)
        r.origin.x += leftPadding
        return r
    }
    
    override func layoutSubviews() {
        super.layoutSubviews()
        setup()
    }
    
    private func setup() {
        if let image = leftImage {
            if leftView != nil { return } // critical!
            
            let im = UIImageView()
            im.contentMode = .scaleAspectFit
            im.image = image
            
            leftViewMode = UITextField.ViewMode.always
            leftView = im
            
        } else {
            leftViewMode = UITextField.ViewMode.never
            leftView = nil
        }
    }
}

Dies scheint der klarste und zuverlässigste Weg zu sein, dies zu tun.

Fattie
quelle
2

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.image = UIImage(named: imageName)

        View.addSubview(imageView)

        if Direction.Left == direction
        {
            self.leftViewMode = .always
            self.leftView = View
        }
        else
        {
            self.rightViewMode = .always
            self.rightView = View
        }
    }

}
Jethava Yogesh
quelle
Bitte füge ussage hinzu und was brauche ich, um den Frame-Parameter zu übergeben?
Surya Reddy
in dieser Funktion "Frame" -Parameter Verwendung für linke oder rechte Ansicht
jethava yogesh
1

Sie können diese Funktion in Ihre globale Datei oder über Ihre Klasse stellen, damit Sie in der gesamten Anwendung darauf zugreifen können. Nach diesem Vorgang können Sie diese Funktion gemäß Ihren Anforderungen in der Anwendung aufrufen.

        func SetLeftSIDEImage(TextField: UITextField, ImageName: String){

                let leftImageView = UIImageView()
                leftImageView.contentMode = .scaleAspectFit

                let leftView = UIView()

                leftView.frame = CGRect(x: 20, y: 0, width: 30, height: 20)
                leftImageView.frame = CGRect(x: 13, y: 0, width: 15, height: 20)
                TextField.leftViewMode = .always
                TextField.leftView = leftView

                let image = UIImage(named: ImageName)?.withRenderingMode(.alwaysTemplate)
                leftImageView.image = image
                leftImageView.tintColor = UIColor(red: 106/255, green: 79/255, blue: 131/255, alpha: 1.0)
                leftImageView.tintColorDidChange()

                leftView.addSubview(leftImageView)
            }

            SetLeftSIDEImage(TextField: Your_textField, ImageName:YourImageName) // call function
Dhaval Solanki
quelle
2
Willkommen bei StackOverflow. Gibt es eine Möglichkeit, zusammen mit diesem Code eine Erklärung abzugeben? Antworten, die nur Code enthalten, werden aufgrund ihrer geringen Qualität häufig gelöscht. Bitte werfen Sie auch einen Blick auf diese Anleitung zur Beantwortung im Hilfebereich
Graham
0

Warum entscheiden Sie sich nicht für den einfachsten Ansatz? In den meisten Fällen möchten Sie Symbole wie "Font Awesome" hinzufügen. Verwenden Sie einfach die "Font Awesome" -Bibliothek, und es wäre so einfach, einem Textfeld ein Symbol hinzuzufügen:

myTextField.setLeftViewFAIcon(icon: .FAPlus, leftViewMode: .always, textColor: .red, backgroundColor: .clear, size: nil)

Sie müssten zuerst diese schnelle Bibliothek installieren: https://github.com/Vaberer/Font-Awesome-Swift

Alex Zanfir
quelle
5
Warum sollte man eine ganze Bibliothek hinzufügen, um nur eine Glyphe zu erhalten?
0

Dies ist eine modifizierte Version von Mark Moeykens 'Antwort mit zusätzlichem Abstand zwischen Bild und Text und einstellbarer Bildgröße, falls jemand sie benötigt.

Swift 4

    import UIKit

    @IBDesignable
    class TextFieldWithImage: UITextField {

        override func leftViewRect(forBounds bounds: CGRect) -> CGRect {
            return super.leftViewRect(forBounds: bounds)
        }

        @IBInspectable var leftImage: UIImage? {
            didSet {
                updateView()
            }
        }
        @IBInspectable var leftPadding: CGFloat = 0 {
            didSet {
                updateView()
            }
        }
        @IBInspectable var rightPadding: CGFloat = 0 {
            didSet {
                updateView()
            }
        }
        @IBInspectable var imageMaxHeight: CGFloat = 0 {
            didSet {
                updateView()
            }
        }

        @IBInspectable var color: UIColor = UIColor.lightGray {
            didSet {
                updateView()
            }
        }

        func updateView() {
            if let image = leftImage {
                leftViewMode = UITextField.ViewMode.always

                let containerSize = calculateContainerViewSize(for: image)
                let containerView = UIView(frame: CGRect(x: 0, y: 0, width: containerSize.width, height: containerSize.height))

                let imageView = UIImageView(frame: .zero)
                containerView.addSubview(imageView)
                setImageViewConstraints(imageView, in: containerView)

                setImageViewProperties(imageView, image: image)

                leftView = containerView
            } else {
                leftViewMode = UITextField.ViewMode.never
                leftView = nil
            }

            attributedPlaceholder = NSAttributedString(string: placeholder != nil ? placeholder! : "",
                    attributes: [NSAttributedString.Key.foregroundColor: color])
        }

        private func calculateContainerViewSize(for image: UIImage) -> CGSize {
            let imageRatio = image.size.height / image.size.width
            let adjustedImageMaxHeight = imageMaxHeight > self.frame.height ? self.frame.height : imageMaxHeight

            var imageSize = CGSize()
            if image.size.height > adjustedImageMaxHeight {
                imageSize.height = adjustedImageMaxHeight
                imageSize.width = imageSize.height / imageRatio
            }

            let paddingWidth = leftPadding + rightPadding

            let containerSize = CGSize(width: imageSize.width + paddingWidth, height: imageSize.height)
            return containerSize
        }

        private func setImageViewConstraints(_ imageView: UIImageView, in containerView: UIView) {
            imageView.translatesAutoresizingMaskIntoConstraints = false
            imageView.topAnchor.constraint(equalTo: containerView.topAnchor).isActive = true
            imageView.bottomAnchor.constraint(equalTo: containerView.bottomAnchor).isActive = true
            imageView.trailingAnchor.constraint(equalTo: containerView.trailingAnchor, constant: -rightPadding).isActive = true
            imageView.leadingAnchor.constraint(equalTo: containerView.leadingAnchor, constant: leftPadding).isActive = true
        }

        private func setImageViewProperties(_ imageView: UIImageView, image: UIImage) {
            imageView.contentMode = .scaleAspectFit
            imageView.image = image
            imageView.tintColor = color
        }
    }
l.sypniewski
quelle
0

Swift 5

Ähnlich wie @Markus, aber in Swift 5 :

emailTextField.leftViewMode = UITextField.ViewMode.always
emailTextField.leftViewMode = .always
Jerry Chong
quelle
0

SwiftUI

RoundedRectangle(cornerRadius: 50)
                .frame(height: 40)
                .colorInvert() // sets the background white
            .padding()
            .shadow(radius: 12) // adds shadow to the rectangle
                .overlay(
                    HStack(spacing: 20){

                        Image(systemName: "person")
                            .resizable()
                            .aspectRatio(contentMode: .fit)

                        TextField("Username ", text: $username)
                            .font(Font.custom("Arial", size: 25))


                            .font(.title)
                    }
                    .padding()
                    .padding()
                )

Ergebnisse

Roberto Font
quelle
0

Mit der Erweiterung in Swift4 können wir das Bild einfach rechts oder links platzieren, indem wir TextField auffüllen.

extension UITextField {

    //MARK:- Set Image on the right of text fields

  func setupRightImage(imageName:String){
    let imageView = UIImageView(frame: CGRect(x: 10, y: 10, width: 20, height: 20))
    imageView.image = UIImage(named: imageName)
    let imageContainerView: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 55, height: 40))
    imageContainerView.addSubview(imageView)
    rightView = imageContainerView
    rightViewMode = .always
    self.tintColor = .lightGray
}

 //MARK:- Set Image on left of text fields

    func setupLeftImage(imageName:String){
       let imageView = UIImageView(frame: CGRect(x: 10, y: 10, width: 20, height: 20))
       imageView.image = UIImage(named: imageName)
       let imageContainerView: UIView = UIView(frame: CGRect(x: 0, y: 0, width: 55, height: 40))
       imageContainerView.addSubview(imageView)
       leftView = imageContainerView
       leftViewMode = .always
       self.tintColor = .lightGray
     }

  }

Verwenden Sie den Code für die Einrichtung des linken Bildes: -

   self.password_text_field.setupLeftImage(imageName: "unlock")

Ausgabe :)

Geben Sie hier die Bildbeschreibung ein

Ashutosh Kumar Mishra
quelle