15

Android 4スマートフォン用のhtml5ページを設計しており、開いたときにフルスクリーンで自動再生する必要がある単一の3gpp(またはmp4)ビデオを使用しています。ビデオの終了時に別の URL にリダイレクトする必要があります。

Android 4 では自動再生が許可されなくなったので、ユーザーがクリックしてビデオを開始する必要があるポスター画像を表示することにしました。それで:

  1. フルスクリーンモードが呼び出されます
  2. ビデオは自動的に開始する必要があります(実際には、ユーザーがポスター画像をクリックすることで開始されました)
  3. ビデオの再生が終了すると、Android はフルスクリーンを終了する必要があります
  4. 最後にユーザーを別のページにリダイレクトします。

2 と 3 が機能しない: フルスクリーンを呼び出した後、ユーザーは別の「クリック」を行ってビデオを開始し、ビデオが終了すると exitfullscreen が機能しません (画面が黒くなり、ユーザーは電話の「戻る」キーを押して電話を終了する必要があります)ビデオプレーヤー)。

Android 4のようvideo.webkitExitFullScreen()に見え、無視されます。video.play()

これは私が使用している html5 マークアップと JavaScript コードです。解決策を教えてください。

ありがとう!

    <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>
4

4 に答える 4

1

私はあなたを助けるかもしれないいくつかの提案があります、

これは、AndroidWebアプリケーションではなくAndroidWebビューアプリケーションに適用されます。

androidフックアップまたはandroidwebviewクライアントを作成し、値を変数(クエリ文字列)として渡して、すべてのコントロールがあるAndroidネイティブからビデオを再生できます。

ビデオを再生するためのコードを見つけてください。

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();
}

}

ある種の明るい入り江を実装したい場合は、私に連絡してください。HTML5のサポートをします。

乾杯

于 2012-09-17T14:03:53.800 に答える
1

これが古い投稿であることは知っていますが、誰かがこれを探している可能性があります。個人的には、ビデオが終了した後、ビデオ要素を (単純な jquery $videoElement.hide() で) 非表示にするだけで、ブラウザに自動的に戻ります。

複数のモバイル デバイス (iOS および Android) でこれをテストしました。

ただし、まだ別の問題があります。それは、ブラウザーが全画面表示になっているように見えることです (私の場合、他の問題が発生します)。

于 2014-07-08T14:09:21.503 に答える
0

私は最近、同様の問題を抱えていました。ウェブを何時間も検索した後、これをどのように機能させたかを次に示します。

「play()」メソッドを呼び出す前に、「load()」メソッドを使用します。だからあなたのコードで:

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

Android 2.2、2.3、および IPhone 3 でテストしましたが、動作します。ただし、android 4.0 では再生できないようです。

PS

ビデオの再生が終了したときにリダイレクトする場合は、次のイベントを使用します。

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

function doSomething() {
     //your redirect code here
}
于 2012-06-19T13:23:45.913 に答える