Android draw with finger over webView

问题:

How can I draw over a webView, I want a user to be able to circle and doodle over the webview. The gestureoverlayview would be good, but the drawn line will always disappear after the user takes their finger off the screen.

I would like the user to be able to draw on the screen and keep the drawn lines there when the finger is lifted off.

Many thanks

回答1:

You can stack a WebView underneath a Canvas of some sort that allows the user to paint on it with touch inside of a RelativeLayout. To illustrate this here is an example taken from the API Demos project inside the FingerPaint activity.

I've modified that activity slightly to display a WebView behind the MyView. And I altered the code to make the background of the MyView have 00 alpha (make it invisible). So to the user it appears as though they are drawing "on top" of a browser page.

If you don't already have it grab yourself a copy of the API Demos project and open up the FingerPaint.java file, it is under graphics. Once you have that open edit the onCreate() method to look like this:

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    RelativeLayout rl = new RelativeLayout(this);
    WebView wv = new WebView(this);
    rl.addView(wv);
    rl.addView(new MyView(this));
    setContentView(rl);
    wv.loadUrl("http://google.com");
    mPaint = new Paint();
    mPaint.setAntiAlias(true);
    mPaint.setDither(true);
    mPaint.setColor(0xFFFF0000);
    mPaint.setStyle(Paint.Style.STROKE);
    mPaint.setStrokeJoin(Paint.Join.ROUND);
    mPaint.setStrokeCap(Paint.Cap.ROUND);
    mPaint.setStrokeWidth(12);
    mEmboss = new EmbossMaskFilter(new float[] { 1, 1, 1 },0.4f, 6, 3.5f);
    mBlur = new BlurMaskFilter(8, BlurMaskFilter.Blur.NORMAL);
}

Then Find the onDraw() method of the MyView class. Inside there change the first line from:

canvas.drawColor(0xFFAAAAAA);

to:

canvas.drawColor(0x00AAAAAA);

Run the app and click graphics->FingerPaint. If all goes well you should have a google home page that you can draw on.