HarmonyOS 鸿蒙Next Web 控件加载pdf文件无法监听滚动

发布于 1周前 作者 wuwangju 最后一次编辑是 5天前 来自 鸿蒙OS

HarmonyOS 鸿蒙Next Web 控件加载pdf文件无法监听滚动

Web 控件加载 pdf 文件时，onScroll 没有任何回调

这是我 Web 控件的配置
  
Web({
src: this.url,
controller: this.jsBridge.controller
})
.javaScriptAccess(true)
.javaScriptProxy(this.jsBridge.javaScriptProxy)
.zoomAccess(false)
.onPrompt((event) => this.jsPrompt.onJsPrompt(event))
.onPageBegin((event) => this.webLoad.webPageBegin(event))
.onPageEnd((event) => {
WebCookies.syncDefaultApiCookieToWeb(this.url)
this.webLoad.webPageEnd(event)
})
.multiWindowAccess(false)
.cacheMode(CacheMode.Online)
.onControllerAttached(() => {
Timber.tag(“Bridge”).d("agent -> " + this.jsBridge.controller.getUserAgent())
})
.mixedMode(MixedMode.All)
.domStorageAccess(true)
.databaseAccess(true)
.fileAccess(true)
.imageAccess(true)
.textZoomRatio(100)
.password(false)
.width(‘100%’)
.height(‘100%’)


更多关于HarmonyOS 鸿蒙Next Web 控件加载pdf文件无法监听滚动的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

Harmonyos Next教程
2 回复

目前pdf是以插件的形式在web中加载的，暂不支持监听滚动条； 可以通过web组件的onOverScroll通知网页过度滚动的偏移量的回调判断PDF是否到达顶端，底端。 示例代码：


import web_webview from '@ohos.web.webview';

@Entry

@Component

struct WebPage {

  controller: web_webview.WebviewController = new web_webview.WebviewController()

  build() {

    Column() {

      Web({ src: $rawfile('123.pdf'), controller: this.controller })

        .javaScriptAccess(true)

        .domStorageAccess(true)

        .verticalScrollBarAccess(true)

        .onOverScroll((event) => {

          if (event.yOffset < 0) {

            console.log('已到达顶端')

          }

          if (event.yOffset > 0) {

            console.log('已到达底端')

          }

        })

    }

  }

}

更多关于HarmonyOS 鸿蒙Next Web 控件加载pdf文件无法监听滚动的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next Web控件中，若遇到加载PDF文件无法监听滚动的问题，通常是因为Web控件的滚动事件监听机制与PDF文件的渲染方式之间存在兼容性问题。

可以尝试以下几种方法来解决：

  1. 使用PDF.js库：将PDF文件通过PDF.js库在Webview中渲染，PDF.js是一个纯JavaScript实现的PDF渲染库，它允许在Web页面上直接显示PDF文件，并可以监听滚动事件。

  2. 调整Webview设置：检查Webview的滚动设置，确保其允许滚动。同时，检查是否有其他CSS或JavaScript代码干扰了滚动事件的正常触发。

  3. 监听Webview的滚动事件：虽然直接监听PDF文件的滚动可能受限，但可以尝试监听整个Webview的滚动事件，通过Webview的滚动来间接判断PDF文件的滚动状态。

  4. 检查PDF文件：确保PDF文件本身没有损坏，且格式正确，有时候PDF文件的问题也会导致滚动事件无法监听。

如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html 。

回到顶部