51

我所拥有的：我正在从 URL 加载图像。我只是做(WebView).loadUrl(imageurl, extraheaders)

我得到了什么：图像没有以 WebView 的全宽显示，它周围有空白区域（就像你在桌面浏览器中打开一个小 iamge 一样）

我尝试了什么：将 LayoutAlgorithm 设置为 SINGLE_COLUMN。工作完美，但缩放不起作用。（我在不WebView.getSettings()知道为什么启用它。设置setUseWideViewPort(true);加载图像没有任何空白，但它已完全放大。

4

10 回答 10

97

你也可以做这样的事情。

img在数据字符串的开头（取决于您的 Web 数据格式）添加 CSS 样式。

<style>img{display: inline; height: auto; max-width: 100%;}</style>

为了快速处理 WebView 中的数据，我这样做了。

WebView content = (WebView) findViewById(R.id.webView1);
content.loadDataWithBaseURL(null, "<style>img{display: inline;height: auto;max-width: 100%;}</style>" + post.getContent(), "text/html", "UTF-8", null);

这很像 bansal21ankit 所说的，但它可以在您的 HTML 中的每个图像上工作，而无需额外的工作。

编辑（对帖子内容的澄清）：

您可以使用任何text/html值而不是post.getContent()示例中的值。

此处的发布内容只是从某些数据源加载的内容示例，text/html然后与style使给定内容中的任何图像适合屏幕的部分连接。

于 2014-05-14T13:49:34.627 回答
59

我遇到了同样的问题，这样做效果很好：

Display display = getWindowManager().getDefaultDisplay();
int width = display.getWidth();

String data = "<html><head><title>Example</title><meta name=\"viewport\"\"content=\"width="+width+", initial-scale=0.65 \" /></head>";
data = data + "<body><center><img width=\""+width+"\" src=\""+url+"\" /></center></body></html>";
webView.loadData(data, "text/html", null);

编辑：由于这仍然是公认的答案，因此这是一个更好的解决方案（以下全部归功于 Tony）：

WebView content = (WebView) findViewById(R.id.webView1);
content.loadDataWithBaseURL(null, "<style>img{display: inline;height: auto;max-width: 100%;}</style>" + post.getContent(), "text/html", "UTF-8", null);
于 2012-05-01T09:40:44.967 回答
42

您应该缩放 webView 以适应屏幕：

 WebView data = (WebView) getViewById(R.id.webview1);
 data.getSettings().setLoadWithOverviewMode(true);
 data.getSettings().setUseWideViewPort(true);
于 2012-05-01T08:28:13.663 回答
10

它有点晚了，但我希望这会有所帮助，你可以做的是：

String html = "<html><body><img src=\"" + URL + "\" width=\"100%\" height=\"100%\"\"/></body></html>";
mWebView.loadData(html, "text/html", null);

这将使图像与您的 WebView 的宽度完全相似，其余的您可以调整 WebView 本身。

于 2014-04-02T11:47:35.290 回答
9

对我有用的是：我读到，为了适应屏幕的宽度，您应该将其添加到字段内的 HTML 或 xml 中：

width="100%"

所以我所做的是，我没有缩放和缩放图像，而是得到了 xml，把它放在 StringBuilder 中，找到了字段内部和之前的 src="https://blablabla.com/image.png" “src”子字符串我插入了“width="100%"”，然后用StringBuilder设置我的webView，mi代码是这样的：

public void setWebViewWithImageFit(String content){

        // content is the content of the HTML or XML.
        String stringToAdd = "width=\"100%\" ";

        // Create a StringBuilder to insert string in the middle of content.
        StringBuilder sb = new StringBuilder(content);

        int i = 0;
        int cont = 0;

        // Check for the "src" substring, if it exists, take the index where 
        // it appears and insert the stringToAdd there, then increment a counter
        // because the string gets altered and you should sum the length of the inserted substring
        while(i != -1){
            i = content.indexOf("src", i + 1);
            if(i != -1) sb.insert(i + (cont * stringToAdd.length()), stringToAdd );
            ++cont;
        }

        // Set the webView with the StringBuilder: sb.toString()
        WebView detailWebView = (WebView) findViewById(R.id.web_view);
        detailWebView.loadDataWithBaseURL(null, sb.toString(), "text/html", "utf-8", null);
}

希望这会有所帮助，我花了几个小时才弄清楚如何解决这个问题。

于 2015-02-19T17:23:37.433 回答
7

代码：

web = (WebView) findViewById(R.id.at_image_web);
web.getSettings().setBuiltInZoomControls(true);
web.getSettings().setUseWideViewPort(true);
web.getSettings().setJavaScriptEnabled(true);
web.getSettings().setLoadWithOverviewMode(true);
web.loadUrl(linkImage);
于 2016-03-15T04:55:21.623 回答
1

这对我有用： webView = (WebView) findViewById(R.id.webView); WebSettings webSettings = webView.getSettings(); webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);

于 2015-01-16T14:13:31.460 回答
0

我认为这将解决您的问题：-

      WebView web;

      web = (WebView) findViewById(R.id.webkit);
      web.setWebViewClient(new Callback());
      web.getSettings().setJavaScriptEnabled(true);
      web.getSettings().setLoadWithOverviewMode(true);
      web.getSettings().setUseWideViewPort(true);
      web.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
      web.setScrollbarFadingEnabled(false);
于 2012-05-01T08:30:36.707 回答
0

此代码为我工作：

String strData = "<head>" + "<style>" + ".smal-video-pnl,.smal-video-thumb,.detail-hldr{margin-left: 0px;margin-right:0px;}" + "</style>" +
            "</head>" + mListItem.get(position).getTitbits();
holder.webViewStatus.loadDataWithBaseURL(null, strData, "text/html", "UTF-8", null);
于 2016-12-16T11:52:50.970 回答
0 
@BindingAdapter("wvSetContent")
fun WebView.wvSetContent(content: String?) {
    this.isFocusable = true
    this.isFocusableInTouchMode = true
    this.settings.javaScriptEnabled = true
    this.scrollBarStyle = View.SCROLLBARS_INSIDE_OVERLAY
    this.settings.setRenderPriority(WebSettings.RenderPriority.HIGH)
    this.settings.cacheMode = WebSettings.LOAD_DEFAULT
    this.settings.mixedContentMode = WebSettings.MIXED_CONTENT_ALWAYS_ALLOW

    this.settings.domStorageEnabled = true
    this.settings.loadsImagesAutomatically = true;
    this.settings.setAppCacheEnabled(true)
    this.settings.databaseEnabled = true
    this.settings.setSupportMultipleWindows(false)
    this.loadDataWithBaseURL(null,
        "<style>img{display: inline;height: auto;max-width: 100%;}</style>$content", "text/html", "UTF-8", null)
}

它对我有用

于 2021-01-18T07:59:35.013 回答