1

So, my overall situation is as follows: I have to get some HTML from a wordpress database and render it on a webview.

So I cant work with youtube API , I must render this HTML, ill have embeded videos on it and I need them to pop up on fullscreen. This solution Videos not playing in fullscreen mode wont work on API 10.

Is there anyway to make the embeded videos play on fullscreen below API 11?

Community
  • 1
  • 1
Stephen Lynx
  • 1,077
  • 2
  • 14
  • 29

1 Answers1

2

You can create Frame layout above your WebView and attach to it VideoView. This way you can manage size, add custom MediaControls but there are a lot of work and you will faced with many problems.

Edit: You can capture event by:

  • if you can handle html, you can add JS method, that calls your application method throught the JS bridge. As example you put an image with onclick event. Click by this image calls JsVideFrameCallbackImpl.playVideo('videoUrl') in your app (http://android-developers.blogspot.com/2008/09/using-webviews.html):

    <img src="img/video_1.jpg" width="494px" height="340px" onclick="javascript: JsVideFrameCallbackImpl.playVideo('videoUrl')">
    

and attach addJavascriptInterface in your activity to webview:

wv.addJavascriptInterface(new JsVideFrameCallbackImpl(), "JsVideFrameCallbackImpl");

//....

private final class JsVideFrameCallbackImpl {
    private final static String LOG_TAG = "JsVideFrameCallbackImpl";

    @SuppressWarnings("unused")
    @JavascriptInterface
    public void playVideo(final String videoUri) {
                    // call VideoPlayer activity as example
        startActivity(new Intent(context, VideoPlayer.class));
    }
}
  • or you can get the coords of any html element on the page via the same js-bridge and place VideoView on FrameLayout (Do not forget enable js in webview wv.getSettings().setJavaScriptEnabled(true); before using javascript in webview):

     wv.loadUrl("javascript: jsInitMedia()"); // call js method jsInitMedia
    

jsInitMedia in the html (or you can apply this code directly in WebView as: wv.loadUrl("javascript: var el = document.getElemen..."):

    function jsInitMedia() {
        var el = document.getElementById(dataArray[i]); var coords = el.getBoundingClientRect();
        // get top, left coords, width and height with coords.width, el.offsetTop and so on. Send them back as string (i use json format)
        JsVideFrameCallbackImpl.init(jsonDataWithCoordsAsString);
    }

and in your java code in JsVideFrameCallbackImpl :

    @JavascriptInterface
    public void init(final String json) {
        Log.d(LOG_TAG, "Init:" + json);
        // parse json and extract left, top, width and height
                    // now you can place any View with corresponding coords on your frame
                    //as well you can easy handle all click events  
    }
validcat
  • 6,158
  • 2
  • 29
  • 38
  • How can I capture the event of the video playing from a webview and play it on the VideoView, then? – Stephen Lynx Nov 17 '13 at 13:44
  • I'm going to add answer to your question in my answer, ok? – validcat Nov 18 '13 at 09:44
  • Ill just set the minimum API to 11. Your solution is not pratical, since Im not writing the code that will output the HMTL. Not to mention that that I would have to find a way to get the image for the video and the image by itself wouldnt be intuitive enough to indicate an embedded video. – Stephen Lynx Nov 18 '13 at 12:51
  • > Im not writing the code that will output the HMTL. It's not nessesary, only that you need - find element by id or class name on the html page. And that all. The other you execute from the app code. – validcat Nov 18 '13 at 13:47
  • by the way it's mine solution, worked for my situation but you could look further – validcat Nov 18 '13 at 13:49
  • Alright, so I have an iframe that embeds a youtube video. I can not make it call a javascript call, how can I know when and identify it when it starts to play a video? – Stephen Lynx Nov 18 '13 at 14:14
  • Look, video is started by user click, right? you just attach to your view onClickListener and now you can handle all user events – validcat Nov 18 '13 at 14:16