Lecture d'une vidéo HTML5 en plein écran dans le webview Android

Question

Eh bien, j'ai cherché pendant plusieurs jours déjà, comment afficher une vidéo HTML5 en mode plein écran sur Android WebView.

J'ai réussi à lire des vidéos HTML5 sur mon webview. Les problèmes surviennent lors de l'affichage de la vidéo en mode plein écran.

Comme je l'ai compris, Android a deux façons de gérer la balise <vidéo> :

1. Sur les versions d'Android <= 2.3.3 la méthode onShowCustomView est déclenchée, et je peux avoir l'instance VideoView, et définir des écouteurs lorsque la vidéo se termine, définir des contrôleurs, etc. Jusqu'à présent, tout va bien.

2. Sur ICS (et probablement 3.0 et plus) il semble que le <vidéo> soit traité de manière différente. Lorsque la vidéo HTML5 est lue, le onShowCustomView n'est pas appelé en mode normal - il semble qu'il y ait une activité interne à l'intérieur du WebView qui lit la vidéo, et tous les contrôles qui sont définis dans la balise < video > sont affichés - je ne peux y accéder d'aucune façon. En fait, si la vidéo est lue en mode normal, c'est OK parce que les contrôles sont là et fonctionnent.

Cela m'a conduit au gros problème : lors de l'affichage de la vidéo en mode plein écran, le onShowCustomView est appelé - mais sur ICS, le paramètre "view" n'est pas une instance de VideoView.

J'ai réussi à découvrir que l'instance est de VideoSurfaceView, une classe interne privée de la classe HTML5VideoFullScreen. La seule façon d'accéder à cette classe interne est par réflexion.

Après avoir regardé le GrepCode de cette classe, j'ai appris que, contrairement à VideoView, le HTML5VideoFullScreen$VideoSurfaceView ne contient pas d'instance MediaPlayer dont je pourrais écouter les événements ou accéder aux contrôles. La seule chose que je puisse faire est de prendre ce VideoSurfaceView tel quel et de le placer dans un affichage plein écran sans le contrôler.

En résumé - Lorsque j'affiche une vidéo en plein écran, je ne sais pas quand la vidéo se termine, ses contrôles ne sont pas affichés - c'est assez triste. Je n'arrive pas à obtenir le déclencheur pour fermer le plein écran.

J'ai essayé plusieurs solutions de contournement sans succès :

1. Réflexion : J'ai essayé d'atteindre l'instance HTML5VideoFullScreen, qui contient un membre MediaPlayer, à partir de la classe interne VideoSurfaceView. Je n'ai pas réussi à l'obtenir, je ne suis pas sûr que cela soit possible (ViewSurfaceView ne détient pas l'instance de son propriétaire).

2. S'enregistrer pour les événements vidéo via Javascript (onended, par exemple), et gérer ce dont j'ai besoin en JAVA via JavascriptInterface : J'ai constaté que cette solution n'est pas fiable car en faisant cela, j'ai rencontré un autre problème : la balise < video > peut être imbriquée dans une . La source de l'iframe n'est pas la mienne et je ne peux pas obtenir son contenu (getElementById ou getElementsByTagName[i] sont nuls) - ce qui signifie que je ne peux pas atteindre l'élément < video > à l'intérieur de l'iframe.

Je suis toujours à la recherche d'une solution, il y a très peu d'écrits sur ce sujet. Quelqu'un a-t-il réussi à le résoudre ? Une aide serait très appréciée !

VidéoView classe : Aquí (a MediaPlayer)

HTML5VideoFullScreen$VideoSurfaceView classe : Aquí (n'a pas MediaPlayer)

Answer 1

C'est très bien. Mais si vous voulez que les liens de votre site Web s'ouvrent dans l'application elle-même, ajoutez ce code dans votre ExampleActivity.java :

webView.setWebViewClient(new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            if (Uri.parse(url).getHost().endsWith("yourwebsite.com")) {
                return false;
            }

            Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
            view.getContext().startActivity(intent);
            return true;
        }
    });

Answer 2

La réponse de Cprcrack fonctionne très bien pour les niveaux API 19 et moins. Juste un ajout mineur à la réponse de cprcrack onShowCustomView le fera fonctionner au niveau 21+ de l'API

if (Build.VERSION.SDK_INT >= 21) {
      videoViewContainer.setBackgroundColor(Color.BLACK);
      ((ViewGroup) webView.getParent()).addView(videoViewContainer);
      webView.scrollTo(0,0);  // centers full screen view 
} else {
      activityNonVideoView.setVisibility(View.INVISIBLE);
      ViewGroup.LayoutParams vg = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                    ViewGroup.LayoutParams.MATCH_PARENT);
      activityVideoView.addView(videoViewContainer,vg);
      activityVideoView.setVisibility(View.VISIBLE);
}

Vous devrez également refléter les changements dans onHideCustomView

Answer 3

Il semble qu'à partir de lollipop (ou peut-être juste une version différente de WebView), l'appel de la fonction cprcrack's onHideCustomView() ne fonctionne pas. Elle fonctionne si elle est appelée à partir du bouton de sortie du plein écran, mais lorsque vous appelez spécifiquement la méthode, elle ne sort que du plein écran, mais le bouton de sortie du plein écran ne fonctionne pas. webView reste vide. Une façon de contourner ce problème est d'ajouter simplement ces lignes de code à onHideCustomView() :

String js = "javascript:";
js += "var _ytrp_html5_video = document.getElementsByTagName('video')[0];";
js += "_ytrp_html5_video.webkitExitFullscreen();";
webView.loadUrl(js);

Ceci notifiera au webView que le fullscreen a quitté.