UI 텍스트 필드에 신속하게 아이콘/이미지 추가

UI 텍스트 필드에 신속하게 아이콘/이미지 추가

UITextField에 아이콘/이미지를 추가하고 싶습니다.아이콘/이미지는 자리 표시자에게 남겨 두어야 합니다.

시도해 봤습니다.

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

감사해요.

Sahil은 훌륭한 답변을 해주었고 저는 개발자들이 스토리보드의 UI 텍스트 필드에 이미지를 추가할 수 있도록 @IBDesignable로 확장하고 싶었습니다.

스위프트 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])
    }
}

여기서 무슨 일이 일어나고 있습니까?

이 설계 가능한 기능을 통해 다음을 수행할 수 있습니다.

• 왼쪽에 이미지 설정
• UI 텍스트 필드의 왼쪽 가장자리와 이미지 사이에 패딩을 추가합니다.
• 이미지와 자리 표시자 텍스트가 일치하도록 색상 설정

메모들

• 이미지 색상을 변경하려면 코드의 주석에 있는 해당 메모를 따라야 합니다.
• 이미지 색상은 스토리보드에서 변경되지 않습니다.시뮬레이터/장치에서 색상을 보려면 프로젝트를 실행해야 합니다.

스토리보드에서 설계 가능

런타임에

추가시를 추가해 .emailField.leftViewMode = UITextFieldViewMode.Always

)leftViewMode이라Never)

Swift 4에 대한 답변 업데이트

emailField.leftViewMode = UITextFieldViewMode.always

emailField.leftViewMode = .always

여기에 몇 가지만 더 추가하고 싶습니다.

에 UITextField에는 측에서사는하용좌는사하▁on를 사용합니다.leftView의 UITextField

참고: 설정하는 것을 잊지 마십시오.leftViewModeUITextFieldViewMode.Always에는 은옳일위하여을여▁and.rightViewModeUITextFieldViewMode.Always and기본값은 입니다.UITextFieldViewModeNever

예를 들어

왼쪽에 이미지 추가용

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

오른쪽에 이미지 추가용

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

참고: 이미지를 추가하는 동안 주의해야 할 몇 가지 사항UITextField왼쪽 또는 오른쪽에 있습니다.

• 의 틀을 주는 것을 잊지 마세요.ImageView당신은 어떤 것을 추가할 것입니까?UITextField

  let imageView = UIImageView(프레임: CGRect(x: 0, y: 0, 폭: 20, 높이: 20)

• 가 이지배흰색이미가표않다습니지시되지미에 표시되지 않습니다UITextField

• 해야 .ImageView…의 UITextField.

Swift 3.0용 업데이트

@Mark Moeykens 아름답게 지출하여 @IBDesignable로 만듭니다.

저는 여기에 몇 가지 기능을 수정하고 추가했습니다(오른쪽 이미지에 대한 Bottom Line과 패딩 추가).

참고 오른쪽에 이미지를 추가하려면 다음을 선택할 수 있습니다.Force Right-to-Left할 수 있습니다.semantic인터페이스 작성기에서(그러나 오른쪽 이미지 패딩의 경우 rightViewRect 메서드를 재정의할 때까지 작동하지 않습니다.)

이것을 수정했으며 여기에서 소스를 다운로드할 수 있습니다. 이미지텍스트 필드

이전 게시물에서 영감을 받아 연장하는 또 다른 방법.

이미지를 오른쪽이나 왼쪽에 둘 수 있습니다.

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
}

}

사용:

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

즐기세요 :)

패딩을 만들려면 컨테이너 뷰 내부에 이미지를 배치합니다.아이콘 배치가 완료되면 배경색을 제거할 수 있습니다.

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

Swift 3.0의 경우 textField 왼쪽에 이미지 추가

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

스위프트 5

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

확장명을 작성했습니다.

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
  }
}

결과

2020 - 합리적인 해결책

애플사의 이 광기에 대해서 말입니다.

다음은 아마도 가장 "명확하고" 가장 단순한 방법은 다음과 같습니다.

먼저 텍스트를 올바르게 이동해야 합니다.

다음 중요 QA에 유의하십시오. 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)
    }
    

계속해서 왼쪽 이미지를 만들고 이동해야 합니다.

    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
        }
    }
}

이것은 가장 명확하고 신뢰할 수 있는 방법에 관한 것으로 보입니다.

Swift4의 확장 기능을 사용하여 텍스트 필드에 패딩 처리하여 이미지를 오른쪽 또는 왼쪽에 쉽게 배치할 수 있습니다.

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
     }

  }

왼쪽 이미지 설정에 코드를 사용합니다.

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

출력 :)

스위프트 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
        }
    }

}

간단한 IB Designable을 만들었습니다.마음대로 쓰세요.UITextField에서 이 클래스를 확인하십시오.

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)
    }

}

자리 표시자 아이콘을 설정하고 패딩을 텍스트 필드로 설정하는 또 다른 방법입니다.

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
}

이 기능을 전역 파일 또는 클래스 위에 배치하여 전체 응용 프로그램에서 액세스할 수 있습니다.이 절차가 끝나면 응용 프로그램의 요구 사항에 따라 이 기능을 호출할 수 있습니다.

        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

가장 쉬운 방법을 택해 보는 게 어때요?대부분의 경우 글꼴 대박과 같은 아이콘을 추가합니다.글꼴 멋진 라이브러리를 사용하기만 하면 텍스트 필드에 아이콘을 추가하는 것이 다음과 같이 쉽습니다.

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

먼저 이 신속한 라이브러리를 설치해야 합니다. https://github.com/Vaberer/Font-Awesome-Swift

이것은 Mark Moeykens의 답변을 수정한 것으로, 이미지와 텍스트 사이에 패딩이 추가되고 누군가가 필요로 할 경우 이미지 크기를 조정할 수 있습니다.

스위프트 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
        }
    }

스위프트 5

@Markus와 유사하지만 Swift 5:

emailTextField.leftViewMode = UITextField.ViewMode.always
emailTextField.leftViewMode = .always

스위프트 UI

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()
                )

결과.

프레임 기반 솔루션은 경우에 따라 iPad에서 사용할 수 없기 때문에 좋은 접근 방식이라고 생각하지 않습니다.이상적인 솔루션은 imageView에서 텍스트 필드 오른쪽 보기로 제약 조건을 추가하는 것이지만, 그렇게 쉽지는 않습니다.오른쪽 보기는 필요한 경우가 아니면 텍스트 필드 보기 계층 구조에 없는 것으로 나타나므로 다음 작업을 수행해야 합니다.

    private let countryTextField: UITextField = {
        let countryTextField = UITextField()
        countryTextField.translatesAutoresizingMaskIntoConstraints = false
        countryTextField.rightViewMode = .always
        
        let button = UIButton(type: .system)
        button.setImage(UIImage(named: "yourImageName"), for: .normal)
        button.translatesAutoresizingMaskIntoConstraints = false
        
        countryTextField.rightView = button
        countryTextField.setNeedsLayout() //Add rightView in textField hierarchy
        countryTextField.layoutIfNeeded() //Add rightView in textField hierarchy
        
        button.topAnchor.constraint(equalTo: countryTextField.topAnchor).isActive = true
        button.bottomAnchor.constraint(equalTo: countryTextField.bottomAnchor).isActive = true
        button.widthAnchor.constraint(equalTo: countryTextField.heightAnchor).isActive = true
        
        return countryTextField
    }()

모든 장치의 결과는 다음과 같습니다.

또한 내 솔루션은 텍스트 필드 왼쪽 보기에서 작동합니다.

let image = UIImage(systemName: "envelope")
let textField = UITextField()
textField.leftView = UIImageView(image: image)
textField.leftView?.frame = CGRect(x: 5, y: 5, width: 20 , height:20)
textField.leftViewMode = .always

이것이 맞춤형/재사용 가능한 수업에서 저에게 도움이 되었습니다.실제 텍스트 및 왼쪽 보기 아이콘/이미지의 공간에 많은 도움이 됩니다.

func currencyLeftVeiw(image litery: UIImage) {
        self.leftView = UIView(frame: CGRect(x: 10, y: 0, width: 40, height: 40))
        self.leftViewMode = .always
        let leftViewItSelf = UIImageView(frame: CGRect(x: 10, y: 10, width: 20, height: 20))
        leftViewItSelf.image = litery
        leftView?.addSubview(leftViewItSelf)
    }

@Mark Moeykens의 대답을 간단히 하기 위해, 저는 몇 가지 문제를 해결할 수 있도록 약간의 조정을 했습니다.

1. 제 프로젝트에 있는 이미지는 이미지 보기 크기보다 훨씬 큽니다(앱의 다른 부분에서도 사용하고 있기 때문에). 이미지 보기 크기가 필요 이상으로 커졌습니다.
2. 이미지가 없어도 가로 패딩이 가능합니다.
3. 이미지와 텍스트 사이의 간격을 설정할 수 있습니다.

다양한 값은 에서 조정할 수 있습니다.Constants열거의

신용은 @Mark Moeykens에게 돌아갑니다.

import UIKit

final class PaddingWithImageTextField: UITextField {
    private enum Constants {
        static let iconLength: CGFloat = 24.0
        static let imageTextSpacing: CGFloat = 8.0
        static let horizontalPadding: CGFloat = 12.0
        static let placeholderColor = UIColor.lightGray
    }

    var leftImage: UIImage? { didSet { updateView() } }
    var rightImage: UIImage? { didSet { updateView() } }
    override var placeholder: String? {
        didSet {
            attributedPlaceholder = NSAttributedString(string: placeholder != nil ?  placeholder! : "", attributes:[NSAttributedString.Key.foregroundColor: Constants.placeholderColor])
        }
    }

    init() {
        super.init(frame: .zero)

        // Any additional setup you may need.
        /*
        layer.cornerRadius = 8.0
        clipsToBounds = true
        keyboardType = .asciiCapable
        backgroundColor = UIColor(hexString: "#F5F5F5")
        */

        updateView()
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    private func updateView() {
        leftViewMode = .always
        rightViewMode = .always
        if let image = leftImage {
            // Setting the rendering mode allows us to set the tint color and change the entire color of the image.
            let imageView = UIImageView(image: image.withRenderingMode(.alwaysTemplate))
            imageView.translatesAutoresizingMaskIntoConstraints = false
            imageView.widthAnchor.constraint(equalToConstant: Constants.iconLength).isActive = true
            imageView.heightAnchor.constraint(equalToConstant: Constants.iconLength).isActive = true
            imageView.contentMode = .scaleAspectFit
            imageView.tintColor = Constants.placeholderColor
            let stack = UIStackView(arrangedSubviews: [
                createHorizontalPaddingView(),
                imageView,
                createImageToTextPaddingView()
            ])
            stack.axis = .horizontal
            leftView = stack
        } else {
            leftView = createHorizontalPaddingView()
        }

        if let image = rightImage {
            // Setting the rendering mode allows us to set the tint color and change the entire color of the image.
            let imageView = UIImageView(image: image.withRenderingMode(.alwaysTemplate))
            imageView.translatesAutoresizingMaskIntoConstraints = false
            imageView.widthAnchor.constraint(equalToConstant: Constants.iconLength).isActive = true
            imageView.heightAnchor.constraint(equalToConstant: Constants.iconLength).isActive = true
            imageView.contentMode = .scaleAspectFit
            imageView.tintColor = Constants.placeholderColor
            let stack = UIStackView(arrangedSubviews: [
                createImageToTextPaddingView(),
                imageView,
                createHorizontalPaddingView()
            ])
            stack.axis = .horizontal
            rightView = stack
        } else {
            rightView = createHorizontalPaddingView()
        }
    }

    private func createHorizontalPaddingView() -> UIView {
        let view = UIView()
        view.translatesAutoresizingMaskIntoConstraints = false
        view.widthAnchor.constraint(equalToConstant: Constants.horizontalPadding).isActive = true
        return view
    }

    private func createImageToTextPaddingView() -> UIView {
        let view = UIView()
        view.translatesAutoresizingMaskIntoConstraints = false
        view.widthAnchor.constraint(equalToConstant: Constants.imageTextSpacing).isActive = true
        return view
    }
}

이 클래스를 사용하려면 다음과 같은 작업을 수행할 수 있습니다.

let textField = PaddingWithImageTextField()
textField.placeholder = "Code"
textField.leftImage = UIImage() // Your image here
textField.rightImage = UIImage() // Your other image here

(초기화 프로그램에서 텍스트 필드를 설정하는 방법에 따라 다름) 다음과 같은 이미지를 제공합니다.

언급URL : https://stackoverflow.com/questions/27903500/swift-add-icon-image-in-uitextfield