2012-05-23 10 views
15

Estoy diseñando una página html5 para teléfonos inteligentes Android 4 con un solo video de 3gpp (o mp4) que tiene que reproducirse automáticamente a pantalla completa cuando se abre; cuando termine el video, debe redireccionar a otra url.html5 video en Android 4: reproducir pantalla completa y luego redireccionar a otra página web - no funciona

Algunos google me dijeron que la reproducción automática ya no está permitida en Android 4, por lo que opté por mostrar una imagen de póster que el usuario debe hacer clic para iniciar el video. continuación:

  1. modo de pantalla completa se invoca
  2. de vídeo se iniciará automáticamente (era de hecho inicia haciendo clic usuario imagen del cartel de)
  3. cuando termine de vídeo para reproducir Android debe salir de pantalla completa
  4. y finalmente redirigir usuario a otra página.

2 y 3 no están trabajando: después de invocar a pantalla completa el usuario tiene hacer otro "clic" para iniciar el vídeo y cuando el vídeo termina exitFullScreen no funciona (pantalla es negro y el usuario tiene que presionar la tecla "atrás" en la teléfono para salir del reproductor de video del teléfono).

Parece que video.webkitExitFullScreen() y video.play() son ignorados en Android 4.

Este es el marcado HTML5 y JavaScript código que estoy usando, ¿podría por favor me ayude a que apunta a una solución?

Gracias!

<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width; initial-scale=1.0" /> 
    <meta name="description" content="" /> 
    <title>test</title> 

    <script type="text/javascript"> 

     function videoEnd() { 
      var video = document.getElementById("video"); 
      video.webkitExitFullScreen(); 
      document.location = "http://www.google.com"; 
     } 

     function playVideo() { 
      var video = document.getElementById("video"); 
      video.addEventListener('ended', videoEnd, false); 
      video.webkitEnterFullScreen(); 
      video.play(); 
     } 

    </script> 
</head> 
<body> 
    <video id="video" poster="../img/image.jpg" onclick="playVideo();"> 
     <source src="../video/videoname.3gp" type="video/3gpp" /> 
    </video> 
</body> 
+0

video.webkitEnterFullScreen(); ¿esto funcionó para ti en Android 4.1? Lo dudo. –

Respuesta

0

Recientemente he tenido un problema similar. Después de horas buscando en la web, he aquí cómo lo hice funcionar:

Antes de invocar el método "play()", use el método "load()". Por lo tanto, en su código:

function playVideo() { 
     var video = document.getElementById("video"); 
     video.addEventListener('ended', videoEnd, false); 
     video.webkitEnterFullScreen(); 
     video.load(); 
     video.play(); 
    } 

Iestee en Android 2.2, 2.3 e IPhone 3 y funciona. Sin embargo, no parece jugar en Android 4.0.

P.S.

Si desea redirigir cuando finalice la reproducción utilización de este evento:

var video = document.getElementById("video"); 
video.addEventListener("ended",doSomething,true); 

function doSomething() { 
    //your redirect code here 
} 
+2

Gracias. Por desgracia lo necesito para trabajar en Android 4. – guidobras

1

tengo algunos indicios de que podría ayudarle,

Esto será aplicable para la web androide de no aplicación de Android Aplicación web.

Puede crear el enlace de Android o el cliente de vista web de Android, pasar los valores como la variable (Query String) y reproducir el video del nativo de Android, donde tiene todo el control.

Encuentra el código para reproducir el video.

enter code here 

public void videoPlayer(String path, String fileName, boolean autoplay){ 
getWindow().setFormat(PixelFormat.TRANSLUCENT); 
//the VideoView will hold the video 
VideoView videoHolder = new VideoView(this); 
//MediaController is the ui control howering above the video (just like in the default youtube player). 
videoHolder.setMediaController(new MediaController(this)); 
//assing a video file to the video holder 
videoHolder.setVideoURI(Uri.parse(path+"/"+fileName)); 
//get focus, before playing the video. 
videoHolder.requestFocus(); 
if(autoplay){ 
    videoHolder.start(); 
} 

}

Si desea implementar especie de cala brillante, contacta conmigo le ayudaré para el HTML 5

Saludos

0

Parece que en versiones posteriores de androide, programática video.play() requiere autorización explícita del WebView. por ejemplo

settings.setMediaPlaybackRequiresUserGesture(false);

1

sé que esto es una entrada antigua, pero alguien puede estar buscando esto. Personalmente, simplemente oculto el elemento de video (con un simple jquery $ videoElement.hide()) una vez finalizado el video, lo que me lleva de vuelta al navegador automáticamente.

Hemos probado esto en varios dispositivos móviles (iOS y Android).

Todavía tengo otro problema, que es que ahora mi navegador parece ser de pantalla completa (lo que causa otros problemas en mi caso).

+0

Además de lo anterior: Después de algunas google descubrí que el problema con el tema de pantalla completa es la siguiente: ocultar el elemento de vídeo de hecho me lleva de vuelta desde el vídeo a la navegador. Sin embargo, Android dice que, para salir del modo de pantalla completa, se necesita una acción del usuario (deslizando de arriba a abajo). Es por eso que el navegador se mantiene en modo de pantalla completa. No he encontrado ninguna solución para eso. Dado que así es como funciona Android, hemos decidido que una vez que finalice el video, el usuario debe tomar medidas para salir del video y volver al sitio web. – vrijdenker

Cuestiones relacionadas