Всплывающее окно Facebook не прокручивается в WebView — React native

#iphone #react-native #facebook #webview

#iPhone #react-native #Facebook #webview

Вопрос:

Мое приложение имеет WebView и отлично работает в Android и iOS, хотя в некоторых случаях отображается следующее всплывающее окно Facebook с запросом файлов cookie, и прокрутка вниз невозможна. Тогда весь веб-просмотр будет недоступен.

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

Код очень прост:

 <WebView
  source={{
    uri: url
  }}/>
 

Как я мог бы сделать его также прокручиваемым?
Спасибо!

Комментарии:

1. Происходит ли это с URL-адресом Facebook или ничего не прокручивается webview ?

2. @ShahnawazHossan С моим симулятором Android и iOS все хорошо, даже если всплывающее окно появляется, потому что оно полностью помещается на экране. Когда я пытаюсь использовать свой мобильный телефон, всплывающее окно появляется, но слишком большое, и его нужно прокручивать, но я не могу. Я хотел бы сделать его всегда прокручиваемым

Ответ №1:

Возможным решением может быть включение webview в ScrollView

 <ScrollView contentContainerStyle={{ flexGrow: 1 }}>
  <WebView
    source={{
      uri: url
    }}/>
</ScrollView>
 

Другим возможным решением может быть использование:

https://github.com/iou90/react-native-autoheight-webview#readme

Примечание: если webview уже включен в ScrollView проверку, если установка some bottomPadding или some contentInset делает модальную прокрутку до конца.

Ответ №2:

Разрешение слишком мало для отображения всего всплывающего окна.

Вы можете либо уменьшить масштаб с помощью чего-то вроде:

 webview.setInitialScale(1);
webview.getSettings().setLoadWithOverviewMode(true); 
webview.getSettings().setUseWideViewPort(true);
 

Или вы можете отредактировать саму веб-страницу, чтобы уменьшить масштаб, используя мета-окно просмотра страницы, уменьшить всплывающее окно с помощью CSS или добавить полосу прокрутки к этому конкретному элементу, установив для css элемента значение:

 #target{
max-height:100%;
overflow:scroll;
}