2

Is it possible to load a picture to the WebView from the local android phone storage ? Basically what I'm trying to do is, take a picture, then display that picture inside the WebView (like a preview picture) then after filling more information, upload that picture with whole data to the database. Everything is in android studio Java code, the WebView are obviously .html files which I load from the assets folder.

I was thinking maybe I need to create an <img id="image"></img> then get the ID somehow ? But how do I store the picture inside even if I manage to get the ID ?

I've done all the camera stuff, so I can open the camera (through my WebView) and take a picture, the picture saves inside the path which I do know and I know the name of the picture. Also I can currently select the picture from the phone, but the thing is it only selects and does not do anything, so the selection is useless.

If You need any code, I'll edit.

Twisha Kotecha
  • 1,082
  • 1
  • 4
  • 18
Elvis
  • 117
  • 10
  • Related: [How to load local image in Android WebView](https://stackoverflow.com/questions/42266264/how-to-load-local-image-in-android-webview/42266387) But maybe you'll have to do it a little differently today, the other post is 2.5 years old – Bö macht Blau Oct 09 '19 at 18:14
  • Thanks, I've done what is advised in that question, however it opens a new "html" from the string if you know what I mean. And I need it to open inside my current html inside the body. Or I could make a copy of my current .html but add the place to store that image, but what I don't know is how exactly to put that picture inside those `` tags. The method in the link You provided works, but not what I need... – Elvis Oct 09 '19 at 18:58
  • Put just the image name in the src tag and put the image in the same place in the assets directory as the html file. But you do not need any html to show an image. You can directly load an image from assets in the webview. – blackapps Oct 09 '19 at 19:35
  • if the html is from assets and your picture is for instance in /storage/emulated/0/DCIM/Camera then the src tag should look like `file:///storage/emulated/0/DCIM/Camera/mypicture.jpg`;` You can do with out html by just call loadUrl() with that url. – blackapps Oct 09 '19 at 19:38

1 Answers1

2

So I found a solution to what I wanted to do and I'm posting an answer here if anyone someday wonders into this post and wants to know the solution.

Basically after taking a picture I call the javascript function which puts the taken image inside my .html file between <img></img> tags as the source. This is my onActivityResult in MainActivity.java:

    @Override
    public void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == PICK_IMAGE && resultCode == Activity.RESULT_OK) {
            //Getting the full image path of the image taken
            final String imagePath = "file://"+ currentPhotoPath;
            webView.post(new Runnable() {
                @Override
                public void run() {
                    webView.evaluateJavascript("postImage('" + imagePath + "')", null);
                }
            });
            getLocation();
            if (data == null) {
                //Display an error
                Log.d("performClick", "Error: data == null");
                return;
            }
        }
    }

What it does is it calls the javascript function postImage and passes imagePath as a parameter and the function in my hello.js file is:

function postImage(imagePath){
    document.body.innerHTML = "<img src=\""+ imagePath + "\">";
}

Now once I take the picture it appears on my WebView as an image without needing to reload the page or loading another URL with only the image.

Elvis
  • 117
  • 10