CODEWITHSUNDEEP
androidhtmlimagewebviewofflineapps
user4928952
user4928952

Reputation:

How to load images from internal storage in webview in android?

We want to display html page with its contents like text, images etc offline(without internet connection) in webview. We are able to display text only. For image, we are storing image on internal storage(sd card) from image url and replacing that image url(server url) with the image internal storage(sd card) path.

But, those images are not displaying in webview.

For example, Below is the img tag in html..

<img alt="img" class="center_top_img" src="http://test.com/uploads/section/images/523.jpg" />

We are replacing above image url(server url) with the image internal storage(sd card) path like

<img alt="img" class="center_top_img" src=\"file:///data/data/com.app.test/files/523.jpg\" />

Upvotes: 5

Views: 9942

Answers (4)

Ajowi
Ajowi

Reputation: 505

In my case I wanted the images to be in 'internal storage', not the sd-card as you stated in description (and also inferred from your usage of getExternalStorageDirectory - your question title however mentioned 'internal storage'. For this reason, get the right path:

//image paths; 'images' folder was earlier created by getFilesDir
String basePATH = "";
String imagePSPPath = "";
String imagePSP = "passportImage.jpeg"; //can be generated dynamically if needed
File images = new File(getApplicationContext().getFilesDir(), "images");
if(file.exists()) {
    //fine, it exists, build right strings
    basePATH = images.toString();
    imagePSPPath = basePATH +"/"+ imagePSP;
    Log.i("XPATH", imagePSPPath);   //loged for ease of copying
}else {
   //error, path not found
    Toast.makeText(YourActivity.this, "Sorry, path not found: ", Toast.LENGTH_LONG).show();
}

Next, use this path but also ensure that it has 3 forward slashes, not 2. For me, I just copied the XPATH address from LOG.i and pasted it in my Html page directly:

<img src="file:///"+imagePSPPath +" alt="PSP Photo">

Upvotes: 0

Yingchen
Yingchen

Reputation: 370

Wherever the image is, just get its absolute path and add "file://" in advance.

File file = ...
String imagePath + "file://" + file.getAbsolutePath();
String html = "...<img src=\""+ imagePath + "\">...";

Upvotes: 3

josedlujan
josedlujan

Reputation: 5600

Remember you image is inside app directory. You can use this:

<img src="file:///data/data/com.yourapp/files/yourimage.jpg" />

Upvotes: 1

Bhargav Thanki
Bhargav Thanki

Reputation: 4954

Try this

mWebView = (WebView) findViewById(R.id.webview);
mWebView.getSettings().setAllowFileAccess(true);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.getSettings().setBuiltInZoomControls(true);
String base = Environment.getExternalStorageDirectory().getAbsolutePath().toString();
String imagePath = "file://"+ base + "/test.jpg";
String html = "<html><head></head><body><img src=\""+ imagePath + "\"></body></html>";
mWebView.loadDataWithBaseURL("", html, "text/html","utf-8", "");

Upvotes: 2

Related Questions