Реализация эмодзи-гиф клавиатуры в React Native - PullRequest
0 голосов
/ 26 апреля 2020

Я пытаюсь создать приложение чата в реагировать на нативном языке, и я хочу реализовать дополнительный вид клавиатуры, чтобы отобразить эмодзи, GIF, наклейки и т. Д. c точно так же, как Facebook или WhatsApp. Создание этой клавиатуры не было большой задачей, но я сталкиваюсь с проблемой перехода между обычной клавиатурой для набора текста (например, gboard) и моей дополнительной клавиатурой.

Если я пытаюсь переключаться между клавиатурами на FB и Whatsapp, переход очень плавный, похоже, что вторичная клавиатура является частью gboard. Но в моем случае это не одно и то же. Когда у меня откроется обычная клавиатура для набора текста, а затем нажмите кнопку «эмодзи», чтобы открыть дополнительную клавиатуру, на мгновение обе клавиатуры появятся на экране, а затем клавиатура для ввода исчезнет.

Моя реализация:

Я использовал реагирующий нативный TextInput и поместил кнопку с эмодзи на левой стороне. Нажатие на нижнюю часть эмодзи переключает состояние моего компонента, и TextInput автоматически размывается. Вторичная клавиатура реализована в виде, и ее видимость регулируется тем же состоянием компонента, которое переключается кнопкой эмодзи. Это представление имеет абсолютную позицию с нижней частью 0. Представление оболочки этого экрана, содержащего сообщения и TextInput, присутствует внутри KeyboardAvodingView.

Что я пробовал

  • Реализация вспомогательная клавиатура в модальном виде, а не в виде (тот же результат, что и раньше)
  • Присоединение слушателей к клавиатуре, как didShow, didHide (немного улучшается, но теперь я должен дождаться полного исчезновения ввода клавиатуры и затем показать вспомогательная клавиатура, это выглядит немного запаздывающим, так как верхний вид, содержащий сообщения, сначала опускается, а затем снова поднимается).

В чем, я думаю, может быть проблема

  • Представление, содержащее дополнительную клавиатуру, обрабатывается состоянием React, но когда я касаюсь TextInput, клавиатура набора текста открывается почти мгновенно, как будто не зависит от состояния реакции.

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

Прикрепление изображений раздела комментариев FB, поскольку они также используют реактивный и их реализация очень плавная. Набор клавиатуры Вторичная клавиатура

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...