UITextField ViewMode

godo·2022년 11월 12일

우리가 UITextField 를 만들고 이를 활용할 때 겪는 문제점 중에 하나가 바로 위와 같이 옆에 너무 바짝 붙어 있다는 것입니다.
이를 해결하기 위해선 다음과 같은 방식을 취할 수 있습니다.

field.leftView = UIView(frame: CGRect(x: 0, y: 0, width: 5, height: 0))
field.leftViewMode = .always
field.backgroundColor = .white

LeftView

UITextField 에는 leftView 라는 것이 있습니다.

공식문서에 따르면 다음과 같이 되어 있습니다.
텍스트 필드 왼쪽에 보여지는 뷰라고 할 수 있습니다.

이 leftView 는 UIView 를 상속하고 있기 때문에 이를 활용하면 이미지등 다양한 것을 넣어 줄 수 있습니다.

extension UITextField {
    func setIcon(_ image: UIImage) {
        let iconView = UIImageView(
            frame: CGRect(x: 10,
                          y: 5,
                          width: 20,
                          height: 20)
        )
        iconView.image = image
        let iconContainerView: UIView = UIView(
            frame: CGRect(x: 20,
                          y: 0,
                          width: 40,
                          height: 30)
        )
        iconContainerView.addSubview(iconView)
        leftView = iconContainerView
        leftViewMode = .always
    }
}