Android WebView, масштабирование изображения в соответствии с экраном

Что у меня: Я загружаю изображение из URL-адреса. Я просто делаю (WebView).loadUrl(imageurl, extraheaders)

Что я получаю: Изображение не отображается на полной ширине WebView, оно имеет пустое пространство вокруг (например, если вы открываете немного iamge в своем браузере рабочего стола)

Что я пробовал: Настройка LayoutAlgorithm для SINGLE_COLUMN. Работает идеально, но масштабирование не работает. (Я включил его в WebView.getSettings() Не знаю почему. Установка setUseWideViewPort(true); загружает изображение без пробелов, но оно полностью увеличено.

Ответ 1

У меня была такая же проблема, и все это сработало просто:

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);

Изменить: Другое решение, предложенное Тони ниже:

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);

Ответ 2

Вы также можете сделать что-то вроде этого.

Добавьте стиль CSS для img в начале (в зависимости от вашего формата веб-данных) вашей строки данных.

<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, которая делает любое изображение в заданном содержимом подходящим для экрана.

Ответ 3

вы должны масштабировать webView в соответствии с экраном:

 WebView data = (WebView) getViewById(R.id.webview1);
 data.getSettings().setLoadWithOverviewMode(true);
 data.getSettings().setUseWideViewPort(true);

Ответ 4

Немного поздно, но я надеюсь, что это поможет, что вы можете сделать:

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

это сделает изображение в точности похожим на ширину вашего WebView, остальное вы можете настроить сам WebView.

Ответ 5

Что сработало для меня, так это: я прочитал, что для того, чтобы соответствовать ширине экрана, вы должны добавить это в свой HTML или xml внутри поля:

width="100%"

Итак, что я сделал, вместо масштабирования и масштабирования изображений я получил xml, поместил его в StringBuilder, нашел src= "https://blablabla.com/image.png", который находится внутри поля и как раз перед подстрокой "src" я вставил "width =" 100% "", тогда y установил мой webView с помощью StringBuilder, код 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);
}

Надеюсь, что это поможет, мне потребовалось несколько часов, чтобы понять, как это решить.

Ответ 6

код:

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);

Ответ 7

Эта работа для меня: webView = (WebView) findViewById(R.id.webView); WebSettings webSettings = webView.getSettings(); webView.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);

Ответ 8

Я думаю, что это исправит вашу проблему: -

      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);

Ответ 9

Этот код работает для меня:

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);