Реализация функции отображения мягкой клавиатуры

Описание

Пример демонстрирует влияние появления мягкой клавиатуры на разметку страницы при расположении полей ввода в верхней и нижней частях экрана. Для реализации избегания мягкой клавиатуры используются различные методы, такие как установка режима избегания KeyboardAvoidMode.RESIZE, установка режима NavDestination на NavDestinationMode.DIALOG и установка режима отображения ToastShowMode.TOP_MOST. Это помогает разработчикам создавать рациональную разметку страниц при различных сценариях появления мягкой клавиатуры.

Предварительный просмотр эффекта

Страница списка сообщений	Страница чата	Страница электронной почты
Страница комментариев	Страница входа

Инструкция по использованию

1. Нажмите кнопку поиска, чтобы верхняя панель преобразовалась в поле поиска. При нажатии на поле поиска появляется мягкая клавиатура, а список в центре страницы остаётся неизменным.

2. Нажмите на любого контакта, чтобы перейти на страницу чата. При нажатии на поле ввода внизу появляется мягкая клавиатура, список в центре страницы сжимается, а верхняя панель остаётся неизменной.3. Перейдите на страницу электронной почты. При нажатии на отправителя появляется мягкая клавиатура. Проблема сокрытия нижней панели решается путем установки режима избегания мягкой клавиатуры на KeyboardAvoidMode.RESIZE (режим сжатия).

3. Перейдите на страницу комментариев. При нажатии на поле ввода появляется мягкая клавиатура. Проблема смещения страницы решается установкой режима NavDestination на NavDestinationMode.DIALOG (режим диалогового окна) и установкой режима избегания мягкой клавиатуры на режим сжатия.5. Перейдите на страницу входа в диалоговое окно. При переходе на страницу автоматически появляется мягкая клавиатура, и для предотвращения смещения Toast при появлении мягкой клавиатуры используется режим отображения ToastShowMode.TOP_MOST. ### Инженерная директория

├──entry/src/main/ets
│  ├──common
│  │  └──constants
│  │     └──CommonConstants. ets             // Класс констант
│  ├──entryability
│  │  └──EntryAbility. ets                   // Класс входа в программу
│  ├──pages
│  │  ├──ChatListPage. ets                   // Страница списка чатов
│  │  ├──Comment. ets                        // Страница комментариев
│  │  ├──ContactPage. ets                    // Страница контактов
│  │  ├──Index. ets                          // Главная страница
│  │  ├──MailPage. ets                       // Страница почты
│  │  └──ToastAvoid. ets                     // Страница входа
│  └──viewmodel
│     ├──ChatData. ets                       // Класс данных чата
│     └──ContactData. ets                    // Класс данных контактов
└──entry/src/main/resources                 // Директория статических ресурсов приложения

• Когда поле ввода находится в верхней части экрана, мягкая клавиатура по умолчанию появляется снизу и не сжимает макет страницы.
• Когда поле ввода находится в нижней части экрана, мягкая клавиатура появляется снизу и сжимает макет страницы. В этом случае для компонентов, которые не должны сжиматься, требуется настроить безопасную область.* Мягкая клавиатура автоматически появляется при установке свойства defaultFocus TextInput в true.
• Для того чтобы диалоговое окно не уступало место мягкой клавиатуре, необходимо установить режим отображения сообщений showMode в ToastShowMode.TOP_MOST.
• Установка режима избегания мягкой клавиатуры KeyboardAvoidMode.RESIZE (режим сжатия) решает проблему скрытия нижней панели действий.### Относительные разрешения

Не применимо.

Зависимости

Не применимо.

Ограничения и условия

1. Этот пример поддерживает только стандартные системы и устройства: телефоны Huawei.

2. HarmonyOS система: HarmonyOS 5.0.0 Release и выше.

3. Версия DevEco Studio: DevEco Studio 5.0.0 Release и выше.

4. Версия HarmonyOS SDK: HarmonyOS 5.0.0 Release SDK и выше.