Как отключить клавиатуру в SwiftUI

Советы и рекомендации по iOS15

Когда пользователь щелкает внутри TextField, SwiftUI автоматически показывает пользователю клавиатуру. Как только пользователь закончит печатать, мы сами решаем, когда снова закрыть клавиатуру.

Начиная с iOS 15+ мы можем использовать метод экземпляра focused() и привязывать переменную к состоянию фокуса TextField. Более подробную информацию об этом методе можно найти здесь, в Документации для разработчиков Apple.

Отказ от клавиатуры

Чтобы отключить клавиатуру, нам нужно сделать следующее:

  • создайте логическую переменную, которая отслеживает состояние фокуса текстового поля
  • добавьте TextField и добавьте метод focused() в TextField и передайте ранее объявленную переменную
  • изменить фокус, когда пользователь что-то делает, например, нажимает на кнопку

Пример проекта

Чтобы дать вам представление о том, как это работает, давайте рассмотрим пример. Если вы хотите продолжить и у вас еще нет проекта, создайте новый.

ContentView

Когда у вас есть проект, откройте ContentView или представление, с которым вы хотите работать. По умолчанию ContentView должен выглядеть так:

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundColor(.accentColor)
            Text("Hello, world!")
        }
        .padding()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Создание логической переменной

Следуя ранее описанным шагам, нам сначала нужна переменная, которая отслеживает состояние фокуса текстового поля. Добавьте переменную внутри ContentView, но перед переменной body:

struct ContentView: View {
    @FocusState private var fieldIsFocused: Bool  // new
    
    var body: some View {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundColor(.accentColor)
            Text("Hello, world!")
        }
        .padding()
    }
}

Обязательно используйте @FocusState вместо @State. FocusState — это тип оболочки, который SwiftUI обновляет при изменении фокуса в представлении. Подробнее об этом можно узнать в руководстве разработчика здесь.

Добавление текстового поля

Теперь нам, конечно же, также понадобится TextField. TextFields должна иметь переменную, содержащую содержимое TextField, которую мы можем объявить аналогично предыдущей переменной.

Мы можем заменить исходное содержимое тела новым текстовым полем:

struct ContentView: View {
    @FocusState private var fieldIsFocused: Bool
    @State private var secret = ""    // content of the textfield
    
    var body: some View {
        VStack {
            // new TextField:
            TextField("Enter Secret", text: $secret).focused($fieldIsFocused)
        }
        .padding()
    }
}

Добавление кнопки

Теперь у нас все почти готово, единственное, чего не хватает, — это кнопки, которую пользователь может щелкнуть, чтобы закрыть клавиатуру. Мы можем добавить Кнопку под TextField и заставить ее переключать переменную fieldIsFocused.

struct ContentView: View {
    @FocusState private var fieldIsFocused: Bool
    @State private var secret = ""
    
    var body: some View {
        VStack {
            TextField("Enter Secret", text: $secret).focused($fieldIsFocused)
            // new Button with text 'Submit'
            Button("Submit") {
                fieldIsFocused = false    // set fieldIsFocused to false to hide the keyboard
            }
        }
        .padding()
    }
}

Симулятор против предварительного просмотра

Если вы хотите проверить это в предварительном просмотре внутри XCode, вы можете вообще не увидеть клавиатуру при нажатии на текстовое поле. Это потому, что XCode знает, что у нас есть клавиатура на нашем Mac, и мы можем просто использовать ее. Лучший способ попробовать этот код — запустить симулятор.

При нажатии в симуляторе в текстовом поле открывается клавиатура. Нажатие на кнопку «Отправить» снова закроет клавиатуру.

Если после того, как вы нажали на TextField, в вашем симуляторе не появляется клавиатура, нажмите ⌘⇧K. Это переключит аппаратную клавиатуру, если вы снова щелкнете TextField после этого, должна появиться смоделированная клавиатура на телефоне.

Спасибо! ❤️

Поздравляем, теперь вы можете закрыть клавиатуру после того, как пользователь нажал кнопку. Надеюсь, вам понравилось читать этот урок и вы нашли его полезным! 👍

Если вам понравилась эта история, пожалуйста, следуйте за мной для других историй! 😊