[iOS | SwiftUI] TextField Tappable Area 넓히는 방법

MultiLine TextField를 구현할 때,
Tappable Area가 기본값 (1줄)로 설정되어 있어 불편한 UX를 유발한다..!
TextField의 frame 내의 범위에서 아무데나 탭해도 focus가 활성화될 수 있게 만드는 방법이다.

1. @FocusState 정의

@FocusState private var focusField: Field?

enum Field: Hashable {
	case name, area, menu, review
}

2. contentShape & onTapGesture

탭 Area를 조정하고자 하는 TextField에 아래 코드를 작성한다.

.contentShape(Rectangle())
.onTapGesture {
	focusField = .review
}

onTapGesture에서는 focus를 현재 textField로 맞추는 코드를 작성하면 된다.

🏁 전체 코드

Section {
	TextField("", text: $vm.review, axis: .vertical)
		.font(.custom("NanumSquareR", size: 15))
		.multilineTextAlignment(.leading)
		.frame(height: 80, alignment: .top)
		.focused($focusField, equals: .review)
		.contentShape(Rectangle())
		.onTapGesture {
			focusField = .review
		}
	} header: {
		Text("한줄평")
			.font(.custom("NanumSquareB", size: 15))
}