SINGLE_COLUMN 模式下的 Android webview 问题 [英] Android webview issue with SINGLE_COLUMN mode
问题描述
我目前在使用 Android WebView
时遇到问题.这个 webview 目前是这样初始化的:
_post_WebView = (WebView) view.findViewById(R.id.post_webview);_post_WebView.setBackgroundColor(Color.WHITE);_post_WebView.setWebViewClient(new PostWebViewClient());_post_WebView.getSettings().setBuiltInZoomControls(true);_post_WebView.getSettings().setSupportZoom(true);_post_WebView.getSettings().setPluginState(PluginState.ON);_post_WebView.getSettings().setJavaScriptEnabled(true);_post_WebView.getSettings().setRenderPriority(RenderPriority.HIGH);_post_WebView.getSettings().setCacheMode(WebSettings.LOAD_DEFAULT);_post_WebView.setWebChromeClient(new WebChromeClient() {});_post_WebView.getSettings().setUseWideViewPort(false);_post_WebView.getSettings().setLoadWithOverviewMode(true);_post_WebView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
此网页视图用于显示从服务器检索到的 HTML 字符串.(使用 loadData
方法).现在的问题是,在 SINGLE_COLUMN
模式下,图像和文本在宽度和高度上都正确调整了大小,但是嵌入的 youtube 视频在调整了宽度时,不会在高度上调整大小,因此只显示一个黑匣子.
在 LayoutAlgorithm.NORMAL
中一切正常.如何确保 youtube 视频也在 SINGLE_COLUMN
算法中正确调整大小?
Youtube 视频的嵌入方式如下:
<iframe allowfullscreen="" frameborder="0" height="315" width="420" src="YOUTUBE_VIDEO_LINK"></iframe>
我终于用 loadDataWithBaseURL(null, htmlString, "text/html", "utf-8", null) 解决了
code> 而不是 loadData(htmlString,"text/html","utf-8")
同时添加 100% max-width
属性和自动 width
和 height
属性添加到使用 CSS 的 iframe 中:
htmlString = "<html><head><style>iframe {max-width: 100%; width:auto; height: auto;}</style></head><;body>"+htmlString+"</body></html>";
这不是最干净的方法,但它有效.
如果与布局算法 NARROW_COLUMNS
一起使用,此方法也应该有效.
I'm currently having a issue with the Android WebView
.
This webview is currently initialized like this:
_post_WebView = (WebView) view.findViewById(R.id.post_webview);
_post_WebView.setBackgroundColor(Color.WHITE);
_post_WebView.setWebViewClient(new PostWebViewClient());
_post_WebView.getSettings().setBuiltInZoomControls(true);
_post_WebView.getSettings().setSupportZoom(true);
_post_WebView.getSettings().setPluginState(PluginState.ON);
_post_WebView.getSettings().setJavaScriptEnabled(true);
_post_WebView.getSettings().setRenderPriority(RenderPriority.HIGH);
_post_WebView.getSettings().setCacheMode(WebSettings.LOAD_DEFAULT);
_post_WebView.setWebChromeClient(new WebChromeClient() {});
_post_WebView.getSettings().setUseWideViewPort(false);
_post_WebView.getSettings().setLoadWithOverviewMode(true);
_post_WebView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);
This webview is used to display a HTML string retrieved from a server. (Using the loadData
method). Now the problem is the fact that in SINGLE_COLUMN
mode, the images and text are resized properly in both width and height but the embedded youtube videos, while resized in width, don't get resized in height and therefore show nothing but a black box.
In LayoutAlgorithm.NORMAL
everything works fine.
How can I make sure the youtube videos get resized properly in the SINGLE_COLUMN
algorithm too?
The Youtube video's are embedded like this:
<iframe allowfullscreen="" frameborder="0" height="315" width="420" src="YOUTUBE_VIDEO_LINK"></iframe>
I finally went and solved it by using loadDataWithBaseURL(null, htmlString, "text/html", "utf-8", null)
instead of loadData(htmlString,"text/html","utf-8")
while adding a 100% max-width
property and a auto width
and height
property to the iframes using CSS:
htmlString = "<html><head><style>iframe {max-width: 100%; width:auto; height: auto;}</style></head><body>"+htmlString+"</body></html>";
It's not the most clean way to do so, but it works.
This method should also work if used with the layout algorithm NARROW_COLUMNS
.
这篇关于SINGLE_COLUMN 模式下的 Android webview 问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!