Android - локальное изображение в webview - PullRequest
Новая
       4

Android - локальное изображение в webview

53 голосов
/ 25 мая 2011

Я пытаюсь отобразить локальное изображение в моем веб-просмотре: 

 String data = "<body>" + "<img src=\"file:///android_asset/large_image.png\"/></body>";
 webview.loadData(data, "text/html", "UTF-8");

Этот код ничего не отображает, вместо: 

 webview.loadUrl("file:///android_asset/large_image.jpg");

Этот работает, ноМне нужна сложная веб-страница, а не просто картинка.

Есть идеи?

Ответы [ 10 ]

66 голосов
/ 26 мая 2011

Загрузите HTML-файл в Webview, поместите ваше изображение в папку ресурсов и прочитайте этот файл изображения, используя HTML. 

<html>
  <table>
    <tr>
      <td>
        <img src="abc.gif" width="50px" alt="Hello">
      </td>
    </tr>
  </table>
</html>

Теперь загрузите этот HTML-файл в Webview 

webview.loadUrl("file:///android_asset/abc.html");
46 голосов
/ 26 мая 2012

Вы также можете попробовать 

String data = "<body>" + "<img src=\"large_image.png\"/></body>";

webView.loadDataWithBaseURL("file:///android_asset/",data , "text/html", "utf-8",null);
26 голосов
/ 25 января 2012

Один удобный способ (часто забываемый) - использовать встроенные изображения base64 в HTML-контенте.Это также будет работать в мобильных браузерах Webkit (IOS, Android ..).

Смысл использования этого метода в том, что вы можете вставлять изображения в контент HTML, а не бороться со ссылками на изображения из веб-просмотра в ограниченную файловую систему. 

  <img src="data:image/jpg;base64,xxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>

  xxxxx = base64 encoded string of images bytes

Если вы хотите предоставить (внедренные base64) данные изображения из файловой системы, вы можете, например:

1) В Android использовать ContentProvider - который предоставит строки изображения в формате base64.

<img src="content://.............."/>

2) Или вы можете предварительно обработать HTML с помощью JSOUP или аналогичного анализатора DOM (перед настройкой его для веб-просмотра) и настроить src для изображения с помощью надлежащим образом закодированного в base64 изображения.накладные расходы включаются в преобразование изображения в строку base64 и, конечно, в представление больших HTML-данных в веб-просмотр.

8 голосов
/ 20 октября 2011

Используйте этот метод. 

mview.loadDataWithBaseURL(folder.getAbsolutePath(), content, "text/html", "windows-1252", "");

folder.getAbsolutePath() может быть "file:///android_asset" или просто "/"

2 голосов
/ 25 мая 2011

Я думаю, что в вашем коде отсутствует \ 

   String data = "<body>" + "<img src=\\"file:///android_asset/large_image.png\"/></body>";
0 голосов
/ 22 августа 2018

Я знаю, что на вопрос дан правильный ответ, но я собираюсь эффективно его реализовать.

Шаг 1: создание HTML-файла в папке ресурсов

например: -imageLaod.html

Примечание. Здесь в HTML-файле мы реализовали полноэкранное изображение, задав style = "width: 100%" 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
                "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
       <title>Load Image</title>
          <style type="text/css">
                h3{
                color:blue;
                }
        </style>   
    </head>
  <body>
        <h3>This image loaded from app asset folder.</h3>
        <img src="yourimage.png" style="width:100%" alt="companylogo"/>
  </body>
</html>

Шаг-2 поместите ваше изображение в папку активов. (Например: yourimage.png)

Шаг-3 поместите приведенный ниже код в Java-файл. 

    String folderPath = "file:android_asset/";
    String fileName = "loadImage.html";
    String file = folderPath + fileName;
    WebView webView = findViewById(R.id.webview)
    webView.getSettings().setBuiltInZoomControls(true);
    webView.getSettings().setDisplayZoomControls(false);
    webView.loadUrl(file);

и готово. Вы можете увидеть полноэкранное изображение с функцией увеличения-уменьшения в WebView .

Надеюсь, это поможет.

0 голосов
/ 28 января 2017

Самый простой и простой способ - создать html-файл с помощью html-редактора, такого как kompozer или что угодно.

Поместите html-файл в папку ресурсов и вызовите webView.loadUrl(filename). Папка активов также должна содержать все изображения, на которые вы ссылаетесь в своих html-файлах.

Заранее исправьте в html-файле путь к вашим изображениям таким образом, чтобы вы указывали только чистое имя файла. Перед именем файла, которое вы передаете loadUrl, должен стоять префикс file:///android_asset/.

Если изображение или файл не загружается, проверьте имена файлов для пробелы , дефис и другие странные вещи и измените имена файлов.

0 голосов
/ 09 октября 2016

решение Зейна сработало для меня. Я забыл добавить свою папку www , содержащую файлы HTML и другие подпапки css, изображения и т. Д. 

webView.loadDataWithBaseURL("file:///android_asset/www/",data , "text/html", "utf-8",null);

..

0 голосов
/ 18 августа 2015

лучшим подходом для меня было создание файла .html со всеми текстами и изображениями в формате MS Word, сохранение файла в виде файла .html и копирование файла .html и соответствующей папки вложений в ресурсы.папку и указав адрес файла .html в папке активов в webview.loadUrl() ... Вот что вам нужно сделать ... 

WebView webview = (WebView) findViewById(R.id.webView1);

webview.loadUrl("file:///android_asset/learning1/learning1.htm");
0 голосов
/ 10 июня 2013

enter image description here

 webView.loadDataWithBaseURL("file:///android_asset/", sourse, "text/html", "UTF-8", null);
...