どうも、ちょげ(@chogetarou)です。
TextFieldをコード上で選択する方法を紹介します。
方法
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
}
}
}
}
}
コメント