0

Есть приложение Андроид с WebView во весь экран и с загружаемым в него HTML-кодом. Когда в коде попадаются широкие таблицы (HTML-тег table), не умещающиеся по ширине на экране, то они просто обрезаются без сроллинга. И эти таблицы невозможно просмотреть полностью. Горизонтальный скроллинг на таких страницах отсутствует, как и на всех остальных.

Как в WebView включить горизонтальный скроллинг для страниц с такими таблицами?

WebView использую самый простой:

<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/webView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" />

Активити сейчас выглядит вот так:

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

        binding.webView.webViewClient = MyWebViewClient()

        binding.webView.apply {
            with(settings) {
                this.javaScriptEnabled = true
                this.builtInZoomControls = true
                this.displayZoomControls = false
                this.useWideViewPort = true
            }

            isVerticalScrollBarEnabled = true
        }

        if (savedInstanceState == null) {
            binding.webView.loadUrl("file:///android_asset/index.html")
        }
    }

    override fun onSaveInstanceState(outState: Bundle) {
        super.onSaveInstanceState(outState)
        binding.webView.saveState(outState)
    }

    override fun onRestoreInstanceState(savedInstanceState: Bundle) {
        super.onRestoreInstanceState(savedInstanceState)
        binding.webView.restoreState(savedInstanceState)
    }

    override fun onKeyDown(keyCode: Int, event: KeyEvent): Boolean {
        if (keyCode == KeyEvent.KEYCODE_BACK && binding.webView.canGoBack()) {
            binding.webView.goBack()
            return true
        }
        return super.onKeyDown(keyCode, event)
    }

    private inner class MyWebViewClient : WebViewClient() {

        override fun shouldOverrideUrlLoading(
            view: WebView?,
            request: WebResourceRequest?
        ): Boolean {
            if (Uri.parse(request?.url.toString()).host
                == Uri.parse("file:///android_asset/index.html").host
            ) {
                return false
            }
            Intent(Intent.ACTION_VIEW, Uri.parse(request?.url.toString())).apply {
                startActivity(this)
            }
            return true
        }
    }
}

Страница на устройстве вот так:

Страница на устройстве

Не скроллируется вправо-влево. Таблица справа какбы обрезана, её нельзя сдвинуть и увидеть её правую часть.

Можно зумом увеличить масштаб страницы, тогда появится горизонтальный скролл. Но сдвинуть его можно толоько до обрезанного изначально края. И не больше.

1 ответ 1

0

Можно программно включить:

webView.apply {
with(settings){
    this.javaScriptEnabled = true
    this.builtInZoomControls = true
    this.displayZoomControls = false
    this.useWideViewPort = true
}


isVerticalScrollBarEnabled = true
}

в вашем случае более важным есть:

this.useWideViewPort = true

update: вот что у меня показывает при данном решении:

картинка_1

картинка_2

картинка_3

12
  • Добавил в описание вопроса код активити. Сейчас на страницах появился зум. Можно только увеличивать. Потом обратно уменшать до изначального размера, в котором контент обрезан. Скроллится только после увеличения до обрезанного края и не дальше. 28 фев в 17:08
  • есть пример страницы которую можно потыкать?
    – Andrew
    28 фев в 18:05
  • Вот здесь лежит: github.com/DroidDump/OraclePLSQL/blob/master/app/src/main/… 28 фев в 18:21
  • @AlekseyVoko, прикрепил в ответ картинку, проверил в браузере, с виду все помещается, уточните пожалуйста - это то что нужно или нет по визуальным признакам?
    – Andrew
    28 фев в 19:55
  • Без CSS стили не подключились... Но на этой картинке видна только часть таблицы. Она скроллируется на устройстве вправо-влево? Нужен именно горизонтальный скролл. 28 фев в 20:10

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.