Наличие html, в котором есть некоторый контент, кажется, невозможно прокручивать после загрузки в веб-браузер Android.
Тот же html, если его напрямую тестировать в браузере, кажется, что прокрутка в порядке.У кого-нибудь есть такая же проблема?
==============
Обновление: Для проблемы с прокруткой оказывается, что вкод прослушивателя отключил MotionEvent.ACTION_MOVE.
val listener = object : OnTouchListener {
override fun onTouch(v: View, event: MotionEvent): Boolean {
return event.action == MotionEvent.ACTION_MOVE
}
}
webview.setOnTouchListener(listener)
Теперь единственная проблема заключается в том, почему iframe не отображает содержимое?
Существует два html-файла: test-scroll.html и test-scroll-content.html (has a table as content)
test-scroll.html:
<html>
<head>
<style>
.test_container_div {
position: relative;
width: 360px;
height: 80px;
overflow: scroll;
}
</style>
</head>
<body>
<p> table in this page</p>
<div class="test_container_div">
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
<tr>
<td>zbr</td>
<td>Ford</td>
<td>50</td>
</tr>
<tr>
<td>Elis</td>
<td>Liu</td>
<td>94</td>
</tr>
<tr>
<td>Pter</td>
<td>Hans</td>
<td>80</td>
</tr>
</table>
</div>
<p> table in iframe srcdoc</p>
<div class="test_container_div">
<iframe scrolling="no"
srcdoc="<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
<tr>
<td>zbr</td>
<td>Ford</td>
<td>50</td>
</tr>
<tr>
<td>Elis</td>
<td>Liu</td>
<td>94</td>
</tr>
<tr>
<td>Pter</td>
<td>Hans</td>
<td>80</td>
</tr>
</table>">
</iframe>
</div>
<p> table in iframe src</p>
<div class="test_container_div">
<iframe width="100% !important" height="300px"
src="test-scroll-content.html"
frameborder="1" scrolling="no" allowfullscreen=""></iframe>
</div>
<p>image in div </p>
<div class="test_container_div">
<img width="100% !important"
src="img_2.jpg">
</img>
</div>
<p>image in iframe </p>
<div class="test_container_div">
<iframe width="100% !important" height="200px"
src="img_2.jpg"
frameborder="1" scrolling="no" allowfullscreen="">
</iframe>
</div>
</body>
</html>
, в которых проверено несколько случаев:
- aтаблица в div, div имеет
height: 80px и overflow: scroll - та же таблица, вставленная в iframe, что и ее
srcdoc - в загрузке iframe в conetnt
src="test-scroll-content.html" - и
<img> имеет src указывает на локальное изображение - тот же файл изображения, но загружается в src iframe
при прямой загрузке test-scroll.html в браузерfile:///Users/linma9/Documents/test-scroll.html, кажется, во всех случаях в браузере содержимое может прокручиваться.
(легче увидеть прокрутку после загрузки в браузер, затем выполнить "проверку" с помощью инструмента разработки Chrome).
С помощью проекта Android и поместите те же файлы в папку ресурсов.
и выполните либо
webview.loadUrl("file:///android_asset/test-scroll.html")
, либо поместите содержимое test-scroll.html в виде строкивнутри функции fun getTestScrollHtmlStr() : String{} и делать:
webview.loadDataWithBaseURL("file:///android_asset/",
getTestScrollHtmlStr(),
"text/html", "utf-8",null)
при запуске на устройстве Android, кажется, что оба способа не могут прокрутить содержимое
(и другая проблема не может отображать содержимое, загруженное сiframe src= ???)
Кто-нибудь знает, как сделать прокрутку содержимого при загрузке их в веб-просмотр Android (либо в iframe, либо нет)?)?
test-scroll-content.html:
<html>
<head>
</head>
<body>
<p> directly put in div</p>
<div>
<table >
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
<tr>
<td>John</td>
<td>Doe</td>
<td>80</td>
</tr>
<tr>
<td>zbr</td>
<td>Ford</td>
<td>50</td>
</tr>
<tr>
<td>Elis</td>
<td>Liu</td>
<td>94</td>
</tr>
<tr>
<td>Pter</td>
<td>Hans</td>
<td>80</td>
</tr>
</table>
</div>
</body>
</html>