Релиз третьей версии SwiftUI принес нам новый декларативный подход к обработке представленных значений. Текстовые поля, формы, панели поиска позволяют пользователям вносить значения, которые возможно взять и использовать с помощью модификатора для View – onSubmit. Сегодня мы научимся использовать этот модификатор, а также посмотрим на его преимущества.
Основы
Создадим View, позволяющую нам искать сообщения, используя searchable View – модификатор.
struct SearchView: View {
@ObservedObject var viewModel: ViewModel
@Binding var query: String
var body: some View {
List(viewModel.messages, id: \.self) { message in
Text(message)
}
.searchable(text: $query)
.onSubmit(of: .search) {
viewModel.search(matching: query)
}
.navigationTitle("Search")
}
}
Как можно увидеть в примере выше, мы отображаем список сообщений из ViewModel и обеспечиваем опцию поиска. Мы также используем View – модификатор onSubmit, чтобы создать замыкание, которое SwiftUI использует при вводе пользователем значения. Как только пользователь нажимает кнопку Return на клавиатуре, SwiftUI вызывает предоставленное замыкание.
Возможно использовать данный модификатор по триггеру выполнения поиска. Это означает, что SwiftUI выполняет замыкание только вследствие выполнения этого поиска. SwiftUI предоставляет нам набор разных триггеров ввода, таких как поиск, текст, форма; этот набор может увеличиться в будущих релизах SwiftUI.
Другими View, которые мы можем использовать в связке с модификатором onSubmit, являются TextField и SecureField. Его можно напрямую добавить в текстовое поле. В таком случае, нужно использовать триггер ввода текста.
struct ContentView: View {
@State private var query = ""
var body: some View {
NavigationView {
TextField("query", text: $query)
.onSubmit(of: .text) {
print(query)
}
}
}
}
Стоит учитывать, что возможно объединить несколько таких модификаторов с различными триггерами ввода в иерархии View и предоставить разные замыкания для отдельных триггеров.
Также реально изменить ярлык кнопки Return, используя модификатор submitLabel. Он требует экземпляр структуры SubmitLabel в виде параметра, определяющего Label кнопки Return. submitLabel имеет много предустановленных значений, таких как done, go, send, join, route, search, return, next и continue.
struct ContentView: View {
@State private var query = ""
var body: some View {
NavigationView {
TextField("query", text: $query)
.submitLabel(.send)
.onSubmit(of: .text) {
print(query)
}
}
}
}
Области применения
Стоит отметить, что возможно использование модификатора onSubmit не только для текстовых полей, но и для всех иерархий View. Именно поэтому SwiftUI предоставляет возможность контролировать области ввода. Например, можно отключить часть иерархии View, которая отвечает за ввод значений.
struct ContentView: View {
@StateObject private var viewModel = ViewModel()
var body: some View {
NavigationView {
VStack {
TextField("phone", text: $viewModel.phone)
.submitScope(viewModel.phone.count > 11)
VStack {
TextField("email", text: $viewModel.email)
TextField("password", text: $viewModel.password)
}
}
.onSubmit(of: .text) {
viewModel.signUp()
}
}
}
}
Модификатор submitScope позволяет избежать вызова действий ввода для отдельных View. В данном примере текстовое поле “phone” не вызовет отправку ввода, пока условие ложно.
Завершение
Сегодня мы узнали о новом View – модификаторе onSubmit, который позволяет в общем виде отладить отправку значений для разных View. Надеюсь, вам понравилась эта статья.