Scaling sync with Canvas on WebView Android

Question

I'm having one issue with doing a Canvas on a WebView: Zooming. I'm using a GestureListener to get the scale factor and adjusting my canvas accordingly with canvas.scale(). This seems to work with gentle, simple pinch to zoom. Occasionally, however, if I try to pinch really quickly or place one finger down and rotate around it with another, the WebView and Canvas don't zoom equal amounts (not good).

A couple of possible solutions: 1) Is there a way to detect how much a WebView is zoomed in? Or calculate it somehow, then set that scale to the canvas. 2) Set the zoom level of the WebView programmatically. Any suggestions?

I've tried several things but nothing seems to get the canvas and WebView to sync nicely when zooming. The onScaleChanged for a WebViewClient only detects double tap, not pinch zooming. Here's my onDraw and GestureListener:

@Override
protected void onDraw(Canvas canvas) {
    canvas.save();
    super.onDraw(canvas);
    clipBounds = canvas.getClipBounds();
    drawPaint.setStrokeWidth(8/mScaleFactor);
    canvas.scale(mScaleFactor, mScaleFactor, 0, 0);
    for (int i = 0; i < colors.size(); i++) {
        canvas.drawPath(paths.get(i), colors.get(i));
    }
    canvas.drawPath(drawPath, drawPaint);
    canvas.drawBitmap(canvasBitmap, 0, 0, drawPaint);
    canvas.restore();
    invalidate();
}


public class ScaleGestureListener extends SimpleOnScaleGestureListener {                
    @Override
    public boolean onScale(ScaleGestureDetector detector) {

        if(Deal.on == false) {
            mScaleFactor *= detector.getScaleFactor();
            mScaleFactor = Math.max(1.0f, Math.min(mScaleFactor, 6.63f));
        }
        invalidate();
        return true;
    }

WebView settings:

WebSettings webSettings = drawView.getSettings();

    webSettings.setLoadWithOverviewMode(true);
    webSettings.setUseWideViewPort(true);
    webSettings.setBuiltInZoomControls(true);
    webSettings.setSupportZoom(true);
    webSettings.setDisplayZoomControls(false);

    webSettings.setJavaScriptEnabled(true);

marcin.kosiba marcin.kosiba · Accepted Answer · 2013-11-14T12:33:29

Calling the getScale method from onDraw should do what you need. It has been marked as deprecated but if onScrollChanged doesn't work for you then I don't think you have any other options.

Scaling sync with Canvas on WebView Android

1 Answers