[SwiftUI]TextFieldを選択するには?

SwiftUI

どうも、ちょげ(@chogetarou)です。

TextFieldをコード上で選択する方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

TextFieldをコード上で選択するには、FocusStateとfocusedモディファイアを使います。

まず、TextFieldを判別するための値を用意します。

enum FocusField {
  /*値*/
}

次に、FocusStateの変数を用意し、型をTextField用の値に合わせます。

@FocusState private var focusState : FocusField?

そして、選択する対象のTextFieldにfocusedモディファイアを付与します。

focusedモディファイアの第1引数にはFocusStateの変数のバインド、第2引数「equals」には選択する際の値を指定します。

TextField("Your name", text: $name)
   //focusStateの値がvalueになった時に選択される
   .focused($focusState, equals: value)

あとは、FocusStateの変数の値を、選択したいTextFieldのfocusedの引数「equals」の値にします。

    //選択したいTextFieldのfocusedの引数「equals」の値に
    focusState = value

これでTextFieldをコード上で選択することができます。

使用例

以下は、使用例です。

struct ContentView: View {
    
    enum FocusField {
        case name
        case age
        case emailAddress
    }
    
    @State var name = ""
    @State var age = ""
    @State var emailAddress = ""
    @FocusState private var focusState : FocusField?
    
    var body: some View {
        VStack (spacing: 50){
            VStack {
                TextField("Your name", text: $name)
                    .focused($focusState, equals: .name)
                    .padding()
                Button("Focus Name") {
                    focusState = .name
                }
            }
            VStack {
                TextField("Your age", text: $age)
                    .focused($focusState, equals: .age)
                    .padding()
                Button("Focus age") {
                    focusState = .age
                }
            }
            VStack {
                TextField("Your emailAddress", text: $emailAddress)
                    .focused($focusState, equals: .emailAddress)
                    .padding()
                Button("Focus emailAddress") {
                    focusState = .emailAddress
                }
            }
            
        }
    }
    
}

コメント

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