SwiftUIにおいて複数行のテキストを入力するには?【TextField/TextEditor】

この記事は約2分で読めます。

SwiftUIにおいて、複数行のテキストを入力するには、次の方法があります。
iOSバージョンにより使用可能な方法が異なります。

iOS16以降

iOS16以降では、TextFieldにおけるイニシャライザのaxisパラメータを指定することで、テキストのスクロール方向を制御できます。

axixパラメータの設定

.vertical → 垂直方向へのスクロール
.horizontal → 水平方向へのスクロール(デフォルト値)

コード例と対応する表示内容

import SwiftUI

struct TextFieldSample: View {
    @State var input = ""
    var body: some View {
        VStack {
            TextField("input", text: $input, axis: .vertical)
                .border(.gray)
                .frame(width: 80)
            Text("入力値:"+input)
            
        }
    }
}

以下のようにフレームを幅を超えて入力すると、自動的に複数行のフレームに拡張されます。

iOS14以降

TextEditorを使用しても複数行の入力を作成することができます。
詳しくは以下の記事で紹介しています。

TextEditorの使い方 | iOSプログラミング【SwiftUI×XCode】 (swappli.com)

タイトルとURLをコピーしました