SwiftUI의 onSubmit

June·2023년 2월 28일
0

SwiftUI-Data

목록 보기
10/12
post-thumbnail

onSubmit

onSubmit 이벤트는 일반적으로 사용자가 키보드의 Enter키 누를 때 발생. 이벤트가 발생하면 일부 코드를 실행해 유효성 검사를 하는 등의 작업 진행.

import SwiftUI

struct OnSubmit: View {
    @State private var name = ""
    @State private var contiuneOnboarding = false
    
    var body: some View {
        NavigationView {
            VStack(spacing: 15) {
                CommonTextView(title: "", desc: "유저가 어떤 식으로든 데이터를 제출할 때 onSubmit을 사용해 코드 실행.")
                
                TextField("이름 입력", text: $name)
                    .textFieldStyle(.roundedBorder)
                    .padding()
                    .submitLabel(.continue)
                    .onSubmit {
                        contiuneOnboarding = true
                    }
                
                NavigationLink("계속하기", isActive: $contiuneOnboarding) {
                    Text("다음 화면")
                }
            }
            .navigationTitle("onSubmit")
        }
    }
}

텍스트필드에 유저가 정보를 입력하고 키보드의 리턴 버튼을 누르면, 뷰가 다음 화면으로 이동함.



여기서 .submitLabel 수정자로 키보드의 return키에 출력되는 텍스트를 변경할 수 있음.



.onSubmitScope()

struct OnSubmitScope: View {
    @State private var firstName = ""
    @State private var lastName = ""
    @State private var contiuneOnboarding = false
    
    var body: some View {
        NavigationView {
            VStack(spacing: 15) {
                CommonTextView(title: "", desc: "onSubmit사용시 엔터 클릭으로 인한 화면전환 이벤트를 막기 위해 submitScope 사용. submitScope 사용시 return 키를 누르면 키보드 닫힘.")
                
                GroupBox("이름 입력") {
                    TextField("이름", text: $firstName)
                        .textFieldStyle(.roundedBorder)
                        .submitScope()
                    
                    TextField("성", text: $lastName)
                        .textFieldStyle(.roundedBorder)
                        .submitLabel(.continue)
                }
                .onSubmit(of: .text) {
                    contiuneOnboarding = true
                }
                    
                NavigationLink("계속하기", isActive: $contiuneOnboarding) {
                    Text("다음 화면")
                }
            }
            .navigationTitle("onSubmit")
        }
    }
}

.submitScope() 수정자를 사용하면, return클릭시 발생되는 이벤트를 방지해준다(return클릭시 키보드 닫힘).

profile
안다고 착각하지 말기

0개의 댓글