LoginSignup
2
0

More than 3 years have passed since last update.

UITextViewを継承せずにPlaceholderを設定する

Last updated at Posted at 2021-02-19

概要

表題の通り UITextView にプレースホルダーを設定していきます。
サブクラスを作って実装する例はいくつかあったので、違う方法で実装していきたいと思います。

1分くらいで読み終わります。恐らく。

環境

  • Xcode 12.4
  • Swift 5.3.2

GIF

編集状態に入るとプレースホルダーが消え、
編集状態を終えると 文字が未入力の場合は プレースホルダーが表示される様子です。

文字入力なし 文字入力あり

実装コード

編集状態が切り替わった際に、Delegateで受け取るtextViewを評価してplaceholderを設定したり、取り除いたりしています。
※表題に関係のある箇所のみ載せています。

class ViewController: UIViewController {
    private let placeholderText = "ここに文字入力してね"

    override func loadView() {
        /* 
        上部にあるUITextFieldの追加・設定等
        */
        let textView = UITextView()
        textView.setPlaceholder(text: placeholderText)
        textView.delegate = self
        view.addSubview(textView)
        /* 
        AutoLayoutの設定やUIの整形等
        */
    }
}

extension ViewController: UITextViewDelegate {
    // 編集状態に入った時に走る処理
    func textViewDidEndEditing(_ textView: UITextView) {
        if textView.text.trimmingCharacters(in: .whitespacesAndNewlines).isEmpty {
            textView.setPlaceholder(text: placeholderText)
        }
    }
    // 編集状態を終えた時に走る処理
    func textViewDidBeginEditing(_ textView: UITextView) {
        if !textView.text.isEmpty && textView.text == placeholderText {
            textView.removePlaceholder()
        }
    }
}

private extension UITextView {
    func setPlaceholder(text: String)  {
        self.text = text
        textColor = .placeholderText // iOS13未満をサポートする場合は使えない色です。
    }

    func removePlaceholder() {
        text = nil
        textColor = .label // 上に同じく
    }
}

終わりに

サブクラスを作成する実装と比較して以下のような利点・欠点があると思います。

利点
  • 余計なクラスファイルを作る必要がない
  • 複数箇所で用いる場合、設定する文言や色、評価の条件を変更しやすい
欠点
  • 複数箇所で用いる場合、似たような処理をそれぞれ記述する必要がある

簡単にはなりましたが、以上となります。

他にも良い方法があれば、ぜひ教えて頂けると嬉しいです:ok_woman:

参考にした記事

stack overflow - Add placeholder text inside UITextView in Swift?(よく見たら古の記事でした)

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0