[iOS - swift] UITextView placeholder 프레임워크 (UITextView+Placeholder)

* 코드로 UI 작성에 편리를 위해 사용한 프레임워크

  - SnapKit

  - Then

UITextView의 placeholder

• UITextView에는 UITextField처럼 placeholder 프로퍼티가 없기 때문에 직접 구현해서 사용
  
  • ex) UITextField에서의 placeholder
    

    // UITextField에서의 placeholder 
    
    textField.placeholder = "abcd@email.com"

• UITextView에서 프레임워크 없이 placeholder 직접 구현해서 사용하는 방법
  • 이전 포스팅 글 `TextView placeholder 적용 방법` 참고

UITextView+Placeholder 프레임워크

• 아래처럼 placeholder 텍스트, 컬러, attributed까지 설정할 수 있는 형태

https://github.com/devxoul/UITextView-Placeholder

• cocoapods 사용하여 의존성 설정

pod 'UITextView+Placeholder'

• import

import UITextView_Placeholder

• UITextView에서 사용할 text font와 placeholder의 attributedString 정의

import UIKit
import Then
import SnapKit
import UITextView_Placeholder

class ViewController: UIViewController {
  // Font
  private let myFont = UIFont.systemFont(ofSize: 16)
  private lazy var attributedString: NSMutableAttributedString = {
    let placeholderText = "abcd@google.com"
    let range = (placeholderText as NSString).range(of: placeholderText)
    let attributedString = NSMutableAttributedString(string: placeholderText)
    let attributes: [NSAttributedString.Key: Any] = [
      .font: self.myFont
    ]
    attributedString.addAttributes(attributes, range: range)
    return attributedString
  }()
  
  // MARK: UI
  private lazy var textView = UITextView().then {
    // TODO
  }
  
  override func viewDidLoad() {
    super.viewDidLoad()
    
    self.view.addSubview(self.textView)
    self.textView.snp.makeConstraints {
      $0.top.left.right.equalToSuperview().inset(100)
      $0.height.equalTo(130)
    }
  }
}

• textView 부분에 적용
  • placeholder에는 특정 font를 사용할 수 있도록 프레임워크에서 제공된 attributedPlaceholder 프로퍼티를 사용하고, text의 폰트에는 따로, font와 textColor 프로퍼티 사용
  • -> UITextView의 attributedString으로 설정하면 attributedPlaceholder 속성과 겹쳐서 적용 안되므로, attributedString사용하지 않고 font, textColor로 설정할 것
    

    private lazy var textView = UITextView().then {
      // font
      $0.attributedPlaceholder = self.attributedString
      $0.font = self.myFont
      $0.textColor = UIColor.black
      
      // Inset
      $0.textContainerInset = .zero
      $0.contentInset = .zero
      $0.scrollIndicatorInsets = .zero
      
      // layer
      $0.layer.borderWidth = 1
      $0.layer.borderColor = UIColor.gray.cgColor
      
      // etc.
      $0.returnKeyType = .done
      $0.isEditable = true
      $0.isScrollEnabled = true
    }​

  • cf) 키보드 done 버튼 탭 시 `\n`값이 아닌, 입력 완료 처리 방법은 해당 포스팅 글 참고

* 전체 코드: https://github.com/JK0369/ExTextView

 

* 참고

https://github.com/devxoul/UITextView-Placeholder