Save Image From WebView

Question

I will try to be short - so I'm making this app, where image is uploaded to custom Webview, draw canvas and save it. Now I successfully execute everything, up to the point of saving it. I've tried a lot of different methods, but none worked.

I save unedited image from Url with:

public void DownloadFromUrl(String fileName) {  //this is the downloader method
    try {
        URL url = new URL(wv2.getUrl()); //you can write here any link
        File file = new File(fileName);
        Canvas canvas = new Canvas();
        wv2.draw(canvas );

        long startTime = System.currentTimeMillis();                   
        Log.d("ImageManager", "download begining");
        Log.d("ImageManager", "download url:" + url);
        Log.d("ImageManager", "downloaded file name:" + fileName);
        URLConnection ucon = url.openConnection();

        InputStream is = ucon.getInputStream();
        BufferedInputStream bis = new BufferedInputStream(is);

        ByteArrayBuffer baf = new ByteArrayBuffer(50);
        int current = 0;
        while ((current = bis.read()) != -1) {
            baf.append((byte) current);
        }

        FileOutputStream fos = new FileOutputStream(file);
        fos.write(baf.toByteArray());
        fos.close();
        Log.d("ImageManager", "download ready in"
                        + ((System.currentTimeMillis() - startTime) / 1000)
                        + " sec");
    } catch (IOException e) {
        Log.d("ImageManager", "Error: " + e);
    }
}

My draw function in custom webview looks like this:

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw (canvas);
    /*code that draws different stuff*/
}

To display edited image I think I need to use this:

canvas = new Canvas(mutableBitmap);                 
wv2.draw(canvas);
tstImage.setImageBitmap(mutableBitmap);

But again, I don't know how to merge canvas into the image. Should I use Drawing Cache? If yes, then how?

[UPDATE]

Okay, so I've managed to save the edited image using this code

wv2.setDrawingCacheEnabled(true);
Bitmap bitmap = Bitmap.createBitmap(wv2.getDrawingCache());
wv2.setDrawingCacheEnabled(false);
tstImage.setImageBitmap(bitmap);
SaveImage(bitmap);

Where SaveImage:

private void SaveImage(Bitmap finalBitmap) {
    String root = Environment.getExternalStorageDirectory().toString();
    File myDir = new File(root + "/Pictures/");    
    myDir.mkdirs();

    String fname = "Image-"+ count +".jpg";
    File file = new File (myDir, fname);
    if (file.exists ()) file.delete (); 
    try {
        FileOutputStream out = new FileOutputStream(file);
        finalBitmap.compress(Bitmap.CompressFormat.JPEG, 90, out);
        out.flush();
        out.close();
    } catch (Exception e) {
        e.printStackTrace();
    }
}

My only problem is that the image I get is what was shown in the webview at that moment. So if I zoom the image, it saves only a piece of it.

[UPDATE 2]

I've modified one of the answers in search for a solution, this is what I've written. No image is getting displayed.

   File imageFile = new File("file://" +    
    Environment.getExternalStorageDirectory() + "/Pictures/" + count + ".jpg");
                        String location = new String("file://" + Environment.getExternalStorageDirectory() + "/Pictures/" + count + ".jpg");
                        if(imageFile.exists()){
                            Bitmap myBitmap = BitmapFactory.decodeFile(location);
                            Bitmap mutableBitmap = myBitmap.copy(Bitmap.Config.ARGB_8888, true);
                            Canvas canvas = new Canvas(mutableBitmap);
                            wv2.draw(canvas);
                            tstImage.setImageBitmap(mutableBitmap);
                        }

http://stackoverflow.com/questions/3474448/saving-image-webview-android?answertab=active#tab-top Quite easy and perfect without any lag. — Nikhil Borad, Dec 16 '15 at 06:11
this link provides answer for saving image from WebView.getUrl(). That image does not contain canvas. — Oleksandr Firsov, Dec 16 '15 at 13:34
I do not understand - can you explain it in a form of answer? — Oleksandr Firsov, Dec 17 '15 at 13:25

score 2 · Answer 1 · answered Dec 18 '15 at 08:59

2

try this

Bitmap workingBitmap = Bitmap.createBitmap(chosenFrame);
Bitmap mutableBitmap = workingBitmap.copy(Bitmap.Config.ARGB_8888, true);
Canvas canvas = new Canvas(mutableBitmap);

answered Dec 18 '15 at 08:59

sKv

66
6

what's a chosenFrame? Height, width and Bitmap.Config? – Oleksandr Firsov Dec 18 '15 at 18:29
so, I've tried replacing your first line with Bitmap workingBitmap = BitmapFactory.decodeFile("file://" + Environment.getExternalStorageDirectory() + "/Pictures/" + count + ".jpg"); or Bitmap workingBitmap = BitmapFactory.decodeFile(wv2.getUrl()); , but I get NullPointer exception in the second line – Oleksandr Firsov Dec 18 '15 at 18:49
check Update 2 for reference – Oleksandr Firsov Dec 18 '15 at 22:06
protected void onDraw(Canvas canvas) { canvas.drawColor(0xFFAAAAAA); canvas.drawBitmap(mutableBitmap, 0, 0, Paint); } – sKv Dec 20 '15 at 04:03

Archibald Platypus · Answer 2 · 2015-12-13T20:11:49.743

1

Why don't you just create a bitmap from the file you got from the web using BitmapFactory and then write it out instead of snapshotting the WebView?

edited Dec 13 '15 at 20:11

answered Dec 13 '15 at 19:48

Archibald Platypus

35
8

I did not quite understand you. Do you mean getting it through getUrl()? If yes, then it saves unedited image and I draw canvas in the WebView that I want to be saved along background image. If I am talking about different thing, then please give a bit more explanation and some code. – Oleksandr Firsov Dec 13 '15 at 20:04
@OleksandrFirsov I think I see now what you are trying to do; you want to make changes to the image in a `WebView`, then "flatten" the `WebView` into a `Bitmap` and save *that* to disk. Is that correct? – Archibald Platypus Dec 13 '15 at 20:13

Save Image From WebView

2 Answers2