Как получить позицию курсора TextInput относительно его родителя или экрана в React native

Есть ли способ получить позицию Y курсора TextInput в реагировать родной, если это возможно без каких-либо нативных (Android/IOS) хаков? Я не имею в виду начало и конец состояния выбора курсора. Я пытаюсь добиться того, чтобы при открытой клавиатуре я хотел бы отображать модальный режим, основанный на положении курсора, как упоминание в Facebook и Instagram. Или может быть в какой строке находится курсор? Таким образом, я могу рассчитать положение курсора.

Это означает, что если курсор находится в начале TextInput (верхняя часть экрана), я бы хотел отобразить модальный режим под курсором до клавиатуры. И если курсор находится в середине или в нижней части TextInput (середина видимой области между верхней частью экрана и клавиатурой), я хотел бы отобразить модальный режим над курсором.

Случай использования:

  1. Здесь курсор находится в верхней части экрана.

enter image description here

А поскольку между положением курсора и клавиатурой есть пространство, я бы хотел отобразить модальное значение между курсором и клавиатурой.

enter image description here

  1. В этом случае курсор находится примерно посередине между верхней частью экрана и клавиатурой.

enter image description here

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

enter image description here

  1. Пользователь также может изменить позицию курсора и начать печатать с новой позиции курсора. Поэтому я не могу просто измерить высоту TextInput и полагаться на высоту TextInput, поэтому мне нужно знать, где находится позиция Y курсора.

ОТВЕТЫ

Ответ 1

Я надеялся получить позицию курсора с помощью метода @JohnKrakov, реализовав фиктивный компонент Text внутри компонента TextInput. Но это невозможно по природе компонента Text. Мне удалось решить это в веб-приложении реагировать, но не с реагировать родной.

Тем не менее, я нашел средний пост о том, как извлечь позицию курсора в реагировать родной. Это очень длинный пост, поэтому я не могу ответить на шаги в этом посте, а вместо этого прошу вас просмотреть его пост и поблагодарить его за его работу.

Обновить

Есть запрос функции, чтобы получить позицию курсора в реагировать на нативный. Если вам это также нужно, просим проголосовать по этой ссылке.

Ответ 2

В дополнение к тому, что вы видели по ссылке, я полагаю, что вы можете достичь желаемого с помощью комбинации https://facebook.github.io/react-native/docs/textinput#oncontentsizechange и onLayout.

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