Клавиатура iPhone закрывает поле ввода

Клавиатура поднимается ровно поверх той строки, в которую вы печатаете. Разбираем, почему это почти всегда вина страницы или приложения, а не самой клавиатуры, и что помогает на практике.

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

iOS ничего не двигает за приложение

Когда клавиатура появляется, система делает ровно одно: сообщает приложению или веб-странице, какого клавиатура размера и где именно она теперь стоит. Это стандартное уведомление, которое может слушать любое приложение, — и на этом обязанности iOS заканчиваются. Система не прокручивает страницу, не сжимает содержимое и не поднимает поле ввода. Она отдаёт замер и оставляет всё остальное тому, во что вы печатаете.

Аккуратно собранное приложение подписывается на это уведомление и перестраивает свою вёрстку: поднимает нужный блок так, чтобы поле осталось видимым над клавиатурой. Приложение, которое уведомление не слушает или ошибается в расчёте, оставляет поле там же, где оно было, — и клавиатура его закрывает просто потому, что полю никто не сказал сдвинуться.

Почему на сайтах это случается чаще, чем в приложениях

Нативное приложение, собранное на стандартных компонентах Apple, чаще всего справляется само: готовые элементы уже умеют уступать место клавиатуре. Веб-страница — в Safari или во встроенном браузере, который открывается по ссылке из Telegram или VK, — история другая. Мобильный Safari при появлении клавиатуры меняет видимую часть страницы, а не саму страницу, и блок, зафиксированный у нижнего края, легко оказывается позиционирован относительно полной высоты документа, а не уменьшившейся видимой области. Клавиатура поднимается навстречу полю, которое никуда не переехало, — и поле уходит за неё.

Чаты поддержки и поля комментариев — классический случай

Именно поэтому жалобы почти всегда про одно и то же: всплывающий чат поддержки в углу сайта, поле комментария под статьёй, строка сообщения в веб-версии сервиса. Все три обычно сделаны как узкая панель, прилипшая к нижнему краю экрана, — ровно та схема вёрстки, которая чаще всего промахивается мимо реальной границы клавиатуры. Обычная строка поиска или поле формы в середине страницы страдают редко: над ними достаточно содержимого, чтобы страницу можно было просто прокрутить пальцем.

Как понять, в чём именно дело

• Ломается на одном конкретном сайте или в одном приложении, а везде остальном всё в порядке — виновата эта страница или это приложение. Это самый частый случай, и на стороне телефона он не чинится.
• То же самое повторяется в Заметках, Сообщениях и Почте, причём с любой клавиатурой — тогда стоит смотреть на само устройство, а не на приложение. Встречается редко.
• Промах только на виджете чата или на блоке, прилипшем к низу страницы, — тот самый случай с фиксированной позицией.
• Появляется сразу после поворота экрана и проходит, если выйти из поля и нажать в него снова, — страница пересчитала вёрстку с опозданием, а не проигнорировала её вовсе.
• Мешает только на маленьком экране или в альбомной ориентации — места под клавиатурой физически меньше, и запас, на который рассчитывал верстальщик, кончился.

Что реально помогает

1. Прокрутите страницу или экран пальцем, когда клавиатура уже поднята. Многие страницы, которые не подстраиваются сами, всё равно прокручиваются вручную, и небольшого движения хватает, чтобы вернуть поле наверх.
2. Выйдите из поля и нажмите в него ещё раз. Часть страниц пересчитывает вёрстку только в момент, когда поле получает фокус, — второе нажатие при уже поднятой клавиатуре нередко чинит то, что не сработало с первого.
3. На сайте в Safari попробуйте открыть версию для компьютера — переключатель лежит в меню страницы слева в адресной строке. Десктопная вёрстка заметно реже опирается на мобильный приём с блоком, приклеенным к низу.
4. Если у сервиса есть собственное приложение — банка, маркетплейса, соцсети, — заполните ту же форму в нём. Нативная версия с большей вероятностью уступит клавиатуре место сама.
5. Напишите в поддержку сервиса, если поле перекрывает на сайте, которым вы пользуетесь каждый день. Разработчику это правится одной правкой вёрстки, а вам иначе никак.

В настройках это не чинится

Отдельного переключателя, который заставил бы страницы подниматься над клавиатурой, в iOS нет — ни в разделе Настройки → Основные → Клавиатура, ни где-либо ещё. Это не параметр устройства, а поведение конкретного приложения или сайта. Сброс настроек, переустановка приложения и перезагрузка телефона здесь тоже почти никогда ничего не меняют: код страницы после перезагрузки остаётся тем же самым.

Помогает ли другая клавиатура?

Нет — и хуже тоже не станет. Любая клавиатура в iOS, встроенная или сторонняя, сообщает свой размер и положение через один и тот же системный механизм. Что делать с этой информацией, решает приложение или страница, а клавиатура не имеет технической возможности дотянуться через эту границу и подвинуть чужую вёрстку. Смена клавиатуры меняет её внешний вид, звук и раскладку — но не меняет того, чья это работа: освободить для неё место.

Единственное, что действительно влияет на картину со стороны клавиатуры, — её высота. Строка подсказок над буквами, дополнительный ряд цифр, панель эмодзи занимают вертикальные пиксели, и на странице, у которой запас и так был нулевой, более высокая клавиатура съедает поле раньше. Но причина остаётся прежней: страница рассчитывала на конкретную высоту вместо того, чтобы спросить систему, какая она сейчас.

Частые вопросы

Похожие руководства

Все руководства