Комбинированный ввод с клавиатуры, вид прокрутки и многострочный ввод текста скрывает часть вида прокрутки

#ios #react-native

Вопрос:

В настоящее время у меня есть настройка, которая выглядит следующим образом:

   lt;ScrollViewgt;   ...   lt;TextInput multiline={true} /gt;  ...  lt;NextButton /gt;  lt;/ScrollViewgt;  

Когда я набираю многострочный текстовый ввод, появляется клавиатура и начинает «Скрывать» части представления прокрутки.

Если бы я набрал слишком много, это даже начало бы скрывать части ввода текста.

Я могу добавить KeyboardAvoidingView, но в результате все равно части представления прокрутки скрыты:

 lt;KeyboardAvoidingViewgt;  ...  lt;ScrollViewgt;   ...   lt;TextInput multiline={true} /gt;  ...  lt;NextButton /gt;  lt;/ScrollViewgt; lt;/KeyboardAvodingViewgt;  

В этом GIF вы можете видеть, что если я прокручу вниз, я смогу «мельком» увидеть кнопку «ОК», но не смогу получить к ней доступ.

Я не совсем уверен, как это отладить. В качестве промежуточного пункта я определяю внешний вид клавиатуры и добавляю «разделительный вид» в нижней части прокрутки, но я определенно предпочел бы избежать этого.

Каковы будут шаги для дальнейшей отладки этого?

введите описание изображения здесь

Ответ №1:

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

 lt;SafeAreaViewgt;  lt;KeyboardAvoidingView behavior={Platform.OS === "ios" ? "padding" : "height"}gt;  ...  lt;ScrollViewgt;   ...   lt;TextInput multiline={true} /gt;  ...  lt;NextButton /gt;  lt;/ScrollViewgt;  lt;/KeyboardAvodingViewgt; lt;/SafeAreaViewgt;  

конечно, все представления являются гибкими=1