使用Canvas绘图保存WebView

时间:2013-10-25 16:12:09

标签: android android-webview android-canvas

我正在尝试将WebView的内容保存为图像,并在其上方绘制画布。我尝试了两种方法:

Picture picture = drawView.capturePicture();
Bitmap bmp = pictureDrawable2Bitmap(new PictureDrawable(picture)); 
MediaStore.Images.Media.insertImage(
    getContentResolver(), bitmap,
    "image" + ".png", "drawing");

 private static Bitmap pictureDrawable2Bitmap(PictureDrawable pictureDrawable){
        Bitmap bitmap = Bitmap.createBitmap(
                pictureDrawable.getIntrinsicWidth() ,pictureDrawable.getIntrinsicHeight(),Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        canvas.drawPicture(pictureDrawable.getPicture());
        return bitmap;
 }

这使我获得了整个WebView页面,但没有使用Canvas绘图。

方法2:

 Bitmap bitmap = Bitmap.createBitmap(drawView.getWidth(), drawView.getHeight(),
                     Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
drawView.draw(canvas);
MediaStore.Images.Media.insertImage(
 getContentResolver(), bitmap,
     "image" + ".png", "drawing");
      drawView.destroyDrawingCache();

这样我同时获得了canvas和WebView,但它只在当前缩放级别捕获它。这意味着如果我在放大时保存它只会保存当前视图状态,而不是整个图像。它的质量也较低。

有关如何将它们组合在一起的任何建议吗?

部分代码:

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);

    canvasBitmap = Bitmap.createBitmap(w + 1500, h + 1500, Bitmap.Config.ARGB_8888);
    drawCanvas = new Canvas(canvasBitmap);
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    clipBounds = canvas.getClipBounds();
    canvas.save();
    //canvas.translate(clipBounds.left, clipBounds.top);
    drawPaint.setStrokeWidth(8/mScaleFactor);
    canvas.scale(mScaleFactor, mScaleFactor, 0, 0);
     if(!pathsDrawn) {
           canvas.drawPath(drawPath, drawPaint);
           pathsDrawn = true;
 }
    canvas.drawBitmap(canvasBitmap, 0, 0, canvasPaint);
    canvas.restore();
}

WebView设置:

    final DrawingView drawView;
    drawView = (DrawingView) findViewById(R.id.pdf);
    drawView.setDrawingCacheEnabled(true);
    WebSettings webSettings = drawView.getSettings();

    webSettings.setLoadWithOverviewMode(true);
    webSettings.setUseWideViewPort(true);
    webSettings.setBuiltInZoomControls(true);
    webSettings.setDefaultZoom(ZoomDensity.FAR);
    webSettings.setSupportZoom(true);
    webSettings.setDisplayZoomControls(false);
    String data = "someurl.jpg"
    drawView.loadUrl(data);     
    drawView.setDrawingCacheEnabled(true);
    Picture picture = drawView.capturePicture();
            Bitmap bmp = pictureDrawable2Bitmap(new PictureDrawable(picture));
            MediaStore.Images.Media.insertImage(getContentResolver(), overlayMark(bmp, DrawingView.canvasBitmap),
                    "dfdsf" + ".png", "drawing");

修改 * 在大多数情况下都有效。我基本上用画布画了两个位图。但是,Web图像位图和绘图位图无法正确缩放。我不得不通过使用矩阵缩放绘图并重新绘制位图然后将其覆盖在Web位图上来抵消这一点。出于某种原因,将其缩放到1.5f使其完美排列,至少在我正在测试它的10英寸平板电脑上。如果有人对此有任何了解或如何让它更好,请告诉我。

     Matrix matrix = new Matrix();
matrix.postScale(1.5f, 1.5f);
Picture picture = drawView.capturePicture();
Bitmap bmp = pictureDrawable2Bitmap(new PictureDrawable(picture));
Bitmap resizedBitmap = Bitmap.createBitmap(DrawingView.canvasBitmap, 0, 0, DrawingView.canvasBitmap.getWidth(), DrawingView.canvasBitmap.getHeight(), matrix, false);
            MediaStore.Images.Media.insertImage(getContentResolver(), overlayMark(bmp, resizedBitmap),
                    "dfdsf" + ".png", "drawing");

 private static Bitmap pictureDrawable2Bitmap(PictureDrawable pictureDrawable){
        Bitmap bitmap = Bitmap.createBitmap(
                pictureDrawable.getIntrinsicWidth() ,pictureDrawable.getIntrinsicHeight(),Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        canvas.drawPicture(pictureDrawable.getPicture());
        return bitmap;
 }

private Bitmap overlayMark(Bitmap bmp1, Bitmap bmp2)    { 
       int bh = bmp1.getHeight();
       int bw = bmp1.getWidth();
       Bitmap bmOverlay = Bitmap.createBitmap(bw,bh,Bitmap.Config.ARGB_8888); 
       Canvas canvas = new Canvas(bmOverlay); 
       canvas.drawBitmap(bmp1, 0, 0, null);
       canvas.drawBitmap(bmp2, 0, 0, null);
       return bmOverlay;
    } 

0 个答案:

没有答案