" + "
Best IT Recipes

Android - local image in webview

I am trying to diplay a local image in my webview:

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

This code does not display anything, not:

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

This works, but I need a complex web page, not just an image.

Any ideas?

+47
android image webview android-webview
May 25 '11 at 16:25
source share
9 answers

Upload the Html file to Webview and put your image in the resources folder and read this image file using Html.

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

Now upload this html file to webview

 webview.loadUrl("file:///android_asset/abc.html");
+60
May 26 '11 at 6:17 a.m.
source share

You can also try

 String data = "<body>" + "<img src=\"large_image.png\"/></body>"; webView.loadDataWithBaseURL("file:///android_asset/",data , "text/html", "utf-8",null);
+42
May 26 '12 at 6:46 a.m.
source share

One convenient way (often forgotten) is to use inline base64 images in HTML content. This will also work in Webkit mobile browsers (iOS, Android ..).

The point of using this method is that you can embed images in HTML content, rather than fighting links to images from a web view in a limited file system.

  <img src="data:image/jpg;base64,xxxxxxxxxxxxxxxxxxxxxxxxxxxx"/> xxxxx = base64 encoded string of images bytes

If you want to provide (base 64) image data from a file system, you can, for example:

1) Android uses ContentProvider - which will provide strings with base64 formatting.

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

2) Or you can pre-process the HTML using JSOUP or a similar DOM parser (before installing it in the webview) and configure the src image with the corresponding base64 encoded code.

The disadvantages of this method are the overhead involved in converting the image to a base64 string and, of course, when processing large HTML data in a webview.

+25
Jan 25 2018-12-12T00:
source share

Use this method.

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

folder.getAbsolutePath() can be "file:///android_asset" or just "/"

+8
Oct 20 '11 at 11:32
source share

I think the code is missing \

  String data = "<body>" + "<img src=\\"file:///android_asset/large_image.png\"/></body>";
+1
May 25 '11 at 16:51
source share

enter image description here

  webView.loadDataWithBaseURL("file:///android_asset/", sourse, "text/html", "UTF-8", null);
0
Jun 10 '13 at 11:29
source share

the best approach for me was to create my .html file with all the texts and images in the MS-word and save the file as a .html file and copy both the .html file and the corresponding folder of investments in the assets folder and specifying the address of the .html file in the folder with resources on webview.loadUrl() ... Here is what you need to do ...

 WebView webview = (WebView) findViewById(R.id.webView1); webview.loadUrl("file:///android_asset/learning1/learning1.htm");
0
Aug 18 '15 at 6:39
source share

Zain's solution worked for me. I forgot to add my www folder with HTML files and other subfolders of css and images, etc.

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

..

0
Oct 09 '16 at 4:41
source share

The easiest and easiest way is to create an html file with an html editor such as kompozer or whatever you like.

Put your html file in the resources folder and call webView.loadUrl(filename) . The assets folder should also contain all the images that you specify in your html files.

Correct in advance in the html file the path to your images so that you only write a clean file name. The file name that you pass to loadUrl must be prefixed with file:///android_asset/ .

If the image or file does not load, check the file names for spaces , hyphens and other strange things and change the file names.

0
Jan 28 '17 at 17:42 on
source share


More articles:


All Articles