Drawing WebView into set position on Canvas

Question

I have created a custom WebView, which will be used to play a gif file. Now I need to draw this to my canvas in a specific position and using a set size.

However, I am not entirly sure how I can convert this webView containing Gif into a Bitmap so that I can insert it into the correct location on my Canvas.

My WebView Class:

public class finishWebView extends WebView
{

    public finishWebView(Context context, String path) 
    {
        super(context);
        loadUrl(path);
    }
}

Getting the raw resource for main Activity:

finishWebView view = new finishWebView(context, "file:///android_asset/test.gif");

The orginal code to convert my image to the correct size and insert into canvas:

finish = BitmapFactory.decodeResource(getResources(), R.drawable.finish);
finish = Bitmap.createScaledBitmap(finish, (PhoneWidth / 5), (PhoneWidth / 5), true);

protected void onDraw(Canvas canvas)
{
    canvas.drawBitmap(finish, (j * totalCellWidth), (i * totalCellHeight), null);
}

So essentially, I need to work out a way to draw the webView with gif image displaying onto the specified locations within my canvas, similar to what I am currently doing with 'canvas.drawBitmap(...)'.

----------------------------------- EDIT ----------------------------------------

Using the code snippet mentioned provided by mikejonesguy, I have got to here, however this now just displays a blank screen.

public static Bitmap createBitmapFromView(View v) {
    Bitmap b = Bitmap.createBitmap(100, 100, Bitmap.Config.RGB_565);
    Canvas c = new Canvas(b);
    v.draw(c);
    return b;
}

// Within onDraw
GIFView gifView = new GIFView(context);
canvas.drawBitmap(createBitmapFromView(gifView), (j * totalCellWidth), (i * totalCellHeight), null);

I have tested my GIFView on normal xml layout pages and it works correctly, just cannot get it inserted into my canvas.

I have created GifView by extending View rather Webview and it working fine.And It has ability to play gif image from sdcard and resource also. — Biraj Zalavadia, Sep 30 '13 at 08:12
Do you have any sample code, to give me a idea how you have implemtned it and how you would add it onto a set position with dynamic size within my onDraw? — SingleWave Games, Sep 30 '13 at 08:19

score 0 · Answer 1 · edited May 23 '17 at 12:03

0

There are several ways to convert a view into a bitmap. This method is one way:

public static Bitmap createBitmapFromView(View v) {
    Bitmap b = Bitmap.createBitmap(v.getWidth(), v.getHeight(), Bitmap.Config.RGB_565);
    Canvas c = new Canvas(b);
    v.draw(c);
    return b;
}

You'll have to wait until your webView has finished loading the GIF, of course, before you call this to get the bitmap.

If you're just trying to play an animated gif, this other SO post might help: Showing gif in android

edited May 23 '17 at 12:03

Community

1
1

answered Oct 04 '13 at 03:09

mikejonesguy

9,779
2
35
49

Not really sure how your above code helps me to implement a gif into a set/ dynamic position within my canvas? – SingleWave Games Oct 04 '13 at 08:10
The above code turns the webview into a bitmap, which you can then draw however you like. Let me ask, though, do you actually need the webview (i.e. is the webview part of your layout that will be visible to the user? Or do you just need the GIF? – mikejonesguy Oct 04 '13 at 14:39
I just need to draw the gif in a set position on my canvas, so no i do not need a webview. However, not really sure how to play the gif. Essentially i want to use my code in my original question only to replace the Bitmap 'finish' with the gif image. – SingleWave Games Oct 05 '13 at 10:50
If that is the case, the sample code in the other SO post that I linked to above is your best option. Decode the GIF to a Movie, and then draw the movie. – mikejonesguy Oct 05 '13 at 22:54
I am still new to android development and really cannot seem to get this implemnted into my canvas, not sure what I am missing. Keep getting null pointers, have tried both your version and the other. Where do I need to define the function and how do I reference them correctly to sotp getting null points. – SingleWave Games Oct 07 '13 at 08:08
I have got my webview gif display correctly when added to an xml layout. However trying to implement you code snippet above to display in a set position within my canvas. However when I do this, I simply get a blank screen. I have updated my question. Thanks – SingleWave Games Oct 16 '13 at 11:07
I have to say, this whole setup seems overly complicated. Is there a reason that you can't just layout your view using XML? Do you absolutely have to use a canvas and drawing calls? Also, is your GIF animated? If so, taking a single bitmap snapshot of it and then drawing it to a canvas won't show the animation). If it's not animated, could you use it as a PNG instead of a GIF? Then you wouldn't need to convert it to a bitmap. More information on what this view is doing would be helpful. – mikejonesguy Oct 16 '13 at 15:19
I agree it is rather complicated, however that is simply the wya my game works and the view is constantly changing and therefore cannot use an xml layout to draw it (essentially it is an rpg game). As for the animation, no it does not have to be a gif. Id i could implement some sort of automatic loop og Bitmap images that woudl work, however again I am restricted here due to the fatc the bitmap that needs animating is being drawn onto the canvas and is not something that is always visible. I've tried a few variations, however cannot quite get it working. Hope that is clearer, thanks. – SingleWave Games Oct 16 '13 at 16:39
Sorry, I'm not going to be able to help you with this. – mikejonesguy Oct 16 '13 at 17:20
Not a problem, think i will just leave it as a static image. – SingleWave Games Oct 17 '13 at 08:34

Drawing WebView into set position on Canvas

1 Answers1