Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android : Display images in Webview

After processing a file, I get a HTML string in which the image is set as

<img src="abc.001.png" width="135" height="29" alt="" style="margin-left:0pt; margin-top:0pt; position:absolute; z-index:-65536" />

The path of the image should not be modified because I have to choose the file item from a list. The image is in the same directory as the file. I load the HTML string using loadData/loadDataWithBaseURL, but the image isn't displayed. I only see its frame.

How can I fix this? And can I apply that solution in case I have many images which are indexed as .001.jpg, .002.png , etc... (all in a directory) ?

Update: Thanks, it works with loadUrl() statement no matter how I name the image. In fact I have to read and process the content before loading it in WebView. That's why I use loadDataWithBaseUrl() statement and get the trouble above. Here's my code in the test project to read and display the content of Test.html.

    String res = "";        
    File file = new File(Environment.getExternalStorageDirectory()+"/Test.html");
    try {
        FileInputStream in = new FileInputStream(file);

        if (in != null) {               
            BufferedReader buffreader = new BufferedReader(
                    new InputStreamReader(in));
            String line;
            while ((line = buffreader.readLine()) != null) {
                res += line;
            }
            in.close();
        }
    } catch (Exception e) {
        e.printStackTrace();
    }       
    wv.loadDataWithBaseURL(null, res, "text/html", "utf-8", null);
  //wv.loadUrl("file://"+Environment.getExternalStorageDirectory()+"/Test.html");

The statement in // works but that's not what I can do in my real project. I have a solution: after processing the content I have to save it in a temporary HTML file then load it, that file will be delete later. However, I'm still looking forward to a better solution :)

like image 966
Minh Nguyen Avatar asked May 22 '12 11:05

Minh Nguyen


2 Answers

Try to change the name of the image file. I thought this is because of double dot in the name.

<img id="compassRose" src="CompassRose.jpg"></img>

this is working for me....

Code:

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.webkit.WebView;

public class StackOverFlowActivity extends Activity {

    private Handler mHandler = new Handler();

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        WebView view=(WebView)findViewById(R.id.webView1);
        view.getSettings().setJavaScriptEnabled(true);
        view.loadUrl("file:///android_asset/index.html");
        view.addJavascriptInterface(new MyJavaScriptInterface(), "Android");
    }

    final class MyJavaScriptInterface
    {
        public void ProcessJavaScript(final String scriptname, final String args)
            {             
                mHandler.post(new Runnable()
                    {
                        public void run()
                            {
                                //Do your activities
                            }
                    });
            }
    }
}

index.html:

<html>
<head>
  <title title="Index"></title>                                   
</head>

<body>
  <h2>Android App demo</h2>
  <br /> <img src="CompassRose.jpg" />
</body>
</html>

enter image description here

Result:

enter image description here

like image 145
Ponmalar Avatar answered Oct 23 '22 01:10

Ponmalar


simply use:

webview.loadUrl("file:///android_asset/mypicture.jpg");
like image 3
Ali Ziaee Avatar answered Oct 23 '22 01:10

Ali Ziaee