我目前正在从网站(论坛)获取 HTML,对其进行修改,并将其显示在 WebView 中。然而,有时,有些字符串太长并且没有任何字符,WebView 认为允许换行,因此 WebView 水平拉伸并引入水平滚动。我讨厌水平滚动,我想强制 WebView 将这些行换行到一个新行,无论 WebView 是否喜欢它前面换行的字符。
注意:我确实希望 WebView 仍然可以垂直展开和滚动。
使用以下样式来打破所有类型的单词。 参考链接 css-tricks.com
style="overflow-wrap: break-word; word-wrap: break-word; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; "
Run Code Online (Sandbox Code Playgroud)
演示
String html ="<html> <head><meta name=\"viewport\" content=\"width=device-width, user-scalable=0,initial-scale=1.0\"></head><body style=\"overflow-wrap: break-word; " +
"word-wrap: break-word; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; \">" +
YourHtmlText +"</body></html>";
webView.loadDataWithBaseURL(null, html, "text/html", "utf-8",
"about:blank");
Run Code Online (Sandbox Code Playgroud)
将此功能添加到您的网络视图中
myWebView.loadUrl("javascript:stopScrolling()");
Run Code Online (Sandbox Code Playgroud)
在你的index.html中添加这个函数
function stopScrolling()
{
document.ontouchmove = function(e){ e.preventDefault(); }
}
Run Code Online (Sandbox Code Playgroud)