Swift UI 入力フォームの制御 @FocusState

Swift UI のText Fieldへの入力完了後、余白をタップすることで、TextFieldのフォーカスを外す方法を備忘録としてまとめました。

コード

struct LoginFormView: View {
    @State  private var searchString = ""
    @FocusState  private var focusedField: Field?
    
    var body: some View {
        VStack{
            TitleText(titleText: "アーティスト", font: .title)
            
            TextField("アーティスト名", text: $searchString)
                .padding(6)
                .bottonGray(isSelected: false)
                .focused($focusedField, equals: .searchString)
            
            Spacer()
        }
        .ignoresSafeArea()
        .padding()
        .contentShape(Rectangle())
        .onTapGesture {
            focusedField = nil
        }
    }
    
    enum Field: Hashable {
        case searchString
    }
}

青の箇所が追加したコードになります。

動作

TextFieldをタップするとキーボードが表示され

背景をタップすると、

テキストボックスが非表示となります。

現在、myLive!ではアーティスト検索ビューの実装を行なっています！
今後も開発の状況を発信していきますので、是非ともよろしくお願いします🙌