2012-05-01 2 views
28

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

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

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

+0

его лучше не использовать LayoutAlgortihm.SINGLE_COLUMN как он устарел, является устаревшим. –

ответ

29

Я была такая же проблема, и делает это работает просто отлично:

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

Edit: Другое решение, предложенное Тони ниже:

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

Спасибо, это любой способ отправить дополнительные заголовки (например, referer), используя эту структуру? – artouiros

+2

см. Ниже ответ Тони, то есть тот, который работает на разных платформах и устройствах. – 2cupsOfTech

29

вы должны масштабировать Webview по размеру экрана:..

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

Если размер изображения больше, чем экран, он не сделает изображение подходящим для экрана, но экран подходит для изображения (он будет выглядеть, как кто-то увеличил масштаб, чтобы увидеть весь контент). – supermus

+1

@supermus Когда LoadWithOverviewMode и UseWideViewPort включены, изображение * будет * соответствовать экрану. Я разрабатываю для уровня API 16, и ваше утверждение неверно относительно этой версии. Я отвечу на этот ответ. –

+0

Не совсем такая же проблема, но это сработало для меня, я использовал изображение в html-файле, который загружаю в webview. . webView.getSettings() setLoadWithOverviewMode (истина); webView.getSettings(). SetUseWideViewPort (true); webView.getSettings(). SetJavaScriptEnabled (true); webView.getSettings(). SetSaveFormData (true); webView.getSettings(). SetBuiltInZoomControls (true); webView.loadUrl ("file: ///android_asset/your_file.html"); – magorich

0

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

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

Это не проблема с прокруткой, мое пустое пространство похоже на 50% экрана. Все такой же. Это похоже на то, что изображение уменьшено больше, чем размер экрана. – artouiros

4

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

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

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

+1

Возможно, это немного поздно, но zoom cotrols не работает с использованием этого подхода. Но это круто и очаровательно :) –

65

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

Добавить стиль 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 без дополнительной работы.


Edit (разъяснения по сообщению содержания):

Вы можете иметь любое значение text/html вместо post.getContent() из примера.

Публичный контент - это всего лишь пример содержимого text/html, который загружается из некоторого источника данных, а затем конкатенируется с частью style, что делает изображение в заданном содержимом подходящим для экрана.

+5

Это должен быть лучший ответ! Благодаря ! Маша Аллах! –

+2

Я думаю, что это очень хорошее мышление! – zIronManBox

+1

Действительно спасатель жизни .. !! – kgandroid

1

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

4

То, что работало для меня: я читал, что для того, чтобы соответствовать ширине экрана, вы должны добавить это в ваш 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); 
} 

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

3

Код:

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

отформатируйте свой код –

Смежные вопросы