3
3

More than 3 years have passed since last update.

【SwiftUI】TextEditorにプレースホルダーを表示する

Last updated at Posted at 2021-08-30

はじめに

SwiftUIのTextEditorは標準でプレースホルダーを表示することができません。
ここではZStackを用いてTextEditorにプレースホルダーを表示する方法を紹介します。

実装

import SwiftUI

struct ContentView: View {
    @State var text = ""

    var body: some View {
        Form {
            ZStack {
                if self.text.isEmpty {
                    HStack {
                        Text("プレースホルダー").opacity(0.25)
                        Spacer()
                    }
                }
                TextEditor(text: self.$text)
                    .lineLimit(nil)
            }
        }

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

image.png

簡単に解説

textが空の時にZStackでプレースホルダーを重ねています。

if self.text.isEmpty {
    HStack {
        Text("プレースホルダー").opacity(0.25)
        Spacer()
    }
}
3
3
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
3
3