Android: draw a WebView with Canvas

Question

I need to draw a WebView with a Canvas. I'm now looking for an answer for two days but can't find anything doing what i need.

At the moment I'm able to show the WebView like this

WebView wv = new WebView(this);
String htmlContent = foo_getHtmlContent();
wv.loadData(htmlContent, "text/html", "UTF-8");
setContentView(wv);

which works pretty fine but starts the view at pos 0,0. Also I'm able to draw a view (inflated from XML) with a Canvas like this

LayoutInflater li = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = li.inflate(R.layout.layout_test, null);
v.measure(MeasureSpec.getSize(v.getMeasuredWidth()), MeasureSpec.getSize(v.getMeasuredHeight()));
v.layout(400, 400, 400, 400);
canvas.translate(100, 100);
v.draw(canvas);

which is exactly the way i want to draw but with the wrong view. I can't find a way to combine these two ways to draw the view from the first code in the way of second code (or any similar way)

Does anyone know how to draw a WebView with a Canvas?

EDIT:
Does no one has any idea?
Now i've tried this but i get a NullPointerException because of the missing attributes.

LayoutInflater li =(LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
WebView wv = null;
try
{
    wv = (WebView) li.createView("WebView", "android.webkit.", null);
    wv.loadData(htmlContent, "text/html", "UTF-8");

    wv.measure(MeasureSpec.getSize(wv.getMeasuredWidth()),MeasureSpec.getSize(wv.getMeasuredHeight()));
    wv.layout(100, 100, 400, 400);

    canvas.translate(100, 100);
    wv.draw(canvas);
}catch (InflateException e)
{
    Log.e("Meassure", "InflateException: " + e);
} catch (ClassNotFoundException e)
{
    Log.e("Meassure", "ClassNotFoundException: " + e);
}

does anyone knows how to create fitting attributes?

EDIT2:
Me again.
I've tried something else and found a way which is working with a TextView but not with a web view. This

LayoutInflater li = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = li.inflate(R.layout.layout_test, null);
TextView textView = (TextView) v.findViewById(R.id.textView1);
textView.setText("Hello World");
v.measure(MeasureSpec.getSize(v.getMeasuredWidth()), MeasureSpec.getSize(v.getMeasuredHeight()));
v.layout(400, 400, 400, 400);
canvas.translate(100, 100);
v.draw(canvas);

works pretty fine and does everything a TextView is supposed to do but this

View v = li.inflate(R.layout.web_layout, null);
WebView wv = (WebView) v.findViewById(R.id.webView);
wv.loadData(htmlContent, "text/html", "UTF-8");
v.measure(MeasureSpec.getSize(v.getMeasuredWidth()), MeasureSpec.getSize(v.getMeasuredHeight()));
v.layout(400, 400, 400, 400);
canvas.translate(100, 100);
v.draw(canvas);//if i substitute this line by setContentView(v); it works but without positioning

does absolutely nothing(except throwing funny stuff to LogCat).
The LogCat-output is the following(repeating about every 10ms):

06-17 14:04:06.210: D/webview(19424): [InitTabEffectPivot] >> nScreenWidth = 720
06-17 14:04:06.210: D/webview(19424): [InitTabEffectPivot] >> nScreenHeight = 1280
06-17 14:04:06.220: D/skia(19424): notifyPluginsOnFrameLoad not postponed

I also tried to call Thread.sleep(10) after line wv.loadData because i've read somewhere that a WebView needs some time to load its content but this doesn't work too. Does at least anyone know what the logcat-output means?

Are you still looking for a solution to this? I positioned a view inside the WebView and inflated a layout with a component. If you are interested I can publish the code. — Gibberish, Oct 05 '14 at 14:39
I'm searching for a way to transform javascript coordinates to android coordinates, there should be a formula for this. As soon as I have it, I will update. https://github.com/GitHK/DivToView — Gibberish, Oct 06 '14 at 09:16
The project should now work on all display and screen sizes! Give it a try and let me know. [Android code](https://github.com/GitHK/DivToView/blob/master/app/src/main/java/it/axant/divtoview/MyActivity.java) [HTML code](https://github.com/GitHK/DivToView/blob/master/app/src/main/assets/index.html) — Gibberish, Oct 06 '14 at 21:52
Sorry, but I can't find out how to do this at runtime. My application reads a config file which defines if there is anything to show and where to show so it has to be set at runtime. — viper1209, Oct 07 '14 at 08:34

score 0 · Answer 1 · answered Jul 01 '13 at 05:27

0

There are several things you need to know. 1st, if you want to make sure the page was loaded, you can do that by creating a custom WebViewClient, and set it to your WebView

private class CustomWebViewClient extends WebViewClient {
...
@Override
public void onPageFinished(WebView view, String url) {
 super.onPageFinished(view, url);
// YOUR CODE HERE
}
...

wv.setWebViewClient(new CustomWebViewClient());

For drawing on the canvas, actually there is more than one way. One simple way, you can create a bitmap from the web view, like this:

webView.setDrawingCacheEnabled(true);
wv.buildDrawingCache(false);
Bitmap bmp = wv.getDrawingCache(false);
webView.setDrawingCacheEnabled(false);

Canvas canvas = new Canvas(bmp);

answered Jul 01 '13 at 05:27

yakobom

2,681
1
25
33

I've already tried do create a Bitmap from my WebView but after Bitmap bmp = wv.getDrawingCache(false); bmp is Null everytime. What do i have to at the //YOUR CODE HERE section? I've already tried wv.setWebViewClient(new WebViewClient()); bit this does not changes anything (visibly) – viper1209 Jul 03 '13 at 11:50
I wrote the onPageFinished part since you mentioned waiting for the page to load. Basically, this should work. Anyway, this subject has been discussed quite a lot, I suggest you try these: http://stackoverflow.com/questions/4633988/generate-bitmap-from-html-in-android http://www.mailinglistarchive.com/html/android-developers@googlegroups.com/2009-09/msg01732.html – yakobom Jul 04 '13 at 12:03

Android: draw a WebView with Canvas

1 Answers1