【关键字】
WebView / 滚动 / 白屏 / 滚动 / layoutMode / height
【问题描述】
长WebView内容滚动时异常白屏,关键代码如下:
import web_webview from '@ohos.web.webview'
@Entry
@Component
struct Test {
controller: web_webview.WebviewController = new web_webview.WebviewController()
build() {
Column() {
Scroll() {
Column() {
Column().backgroundColor(Color.Yellow).height(250).width('50%')
Column().backgroundColor(Color.Green).height(250).width('50%')
Web({
src: $rawfile('aa.html'),
controller: this.controller,
type: 1,
})
.layoutMode(WebLayoutMode.FIT_CONTENT)
.zoomAccess(false)
.nestedScroll({
scrollForward: NestedScrollMode.SELF_FIRST,
scrollBackward: NestedScrollMode.SELF_FIRST,
})
.height(7000)
.width('100%')
Column().backgroundColor(Color.Yellow).height(250).width('50%')
Column().backgroundColor(Color.Green).height(250).width('50%')
Column().backgroundColor(Color.Yellow).height(250).width('50%')
Column().backgroundColor(Color.Green).height(250).width('50%')
}
}
.height('100%')
}
.width('100%')
.height('100%')
}
}
【解决方案】
使用layoutMode时不需要配置高度height。
如果使用layoutMode时配置了height,最高只能设置为4571,否则容易出现白屏。