1

Amazon WebView コンポーネントを使用して、Amazon FireTV 用のビデオ アプリを開発しようとしています。ビデオを自動的に再生することはできません。HTML5 ビデオ DOM プロパティとイベントを使用し、ビデオ タグ プロパティautoplay="autoplay"を設定しようとしました。HTMLコードは次のとおりです。

<!DOCTYPE html>
<html>
    <head>
        <title>Test player</title>
        <script type="text/javascript">
            document.addEventListener("DOMContentLoaded", function () {
                console.log('DOM Loaded!');
                var player = document.getElementById('video-player');
                player.autostart = true;
                player.src = "http://www.w3schools.com/html/mov_bbb.mp4";
                player.load();
                player.addEventListener("canplay", function () { console.log('play'); document.getElementById('video-player').play(); }, false);
            }, false);
    </script>
</head>
<body>
    <video style="background: #e0e0e0; width: 400px; height: 320px;" id="video-player" controls="controls" src="" autoplay="autoplay" >Your browser does not support Video rendering</video>
    <br />
</body>
</html>

WebView を初期化するための Java コードは次のとおりです (onCreate メソッド内)。

this.wrapper = (AmazonWebView) findViewById(R.id.wrapper);
factory.initializeWebView(this.wrapper, 0xFFFFFF, false, null);

this.wrapper.setFocusable(false); // Never allow focus on the WebView because it blocks the Play/Pause, Fast Forward and Rewind buttons

AmazonWebChromeClient webClient = new AmazonWebChromeClient();

this.wrapper.setWebChromeClient(webClient); // Needed in order to use the HTML5 <video> element
AmazonWebSettings browserSettings = this.wrapper.getSettings();
browserSettings.setPluginState(AmazonWebSettings.PluginState.ON);
browserSettings.setJavaScriptEnabled(true);
this.wrapper.addJavascriptInterface(new JSChannel(this.wrapper), "appChannel");
browserSettings.setUseWideViewPort(true);

マニフェストでインターネット アクセス許可とハードウェア アクセラレーションも設定しました。ビデオを自動的に再生するには、Java コードに何かを追加する必要がありますか?

4

2 に答える 2

1

FireTV は、一般的な Android と同様に、HTML5 の動画の自動再生をサポートしていません (はい、私が知っている苦痛です)。

これを回避するには、コンテナ apk から Javascript ブリッジを介して video.play() メッセージを起動する必要があります (これは HTML の loadedmetadata イベントに応答して行いますが、たとえば canPlayThrough やその他のイベントを使用することもできます)トリガーする）

Javaで：

@JavascriptInterface
public void vidLoaded() {
    WebViewActivity.this.runOnUiThread(new Runnable() {
    public void run() {
        webView.loadUrl("javascript: document.getElementById(\"video-player\").play();");
        }
    });
    Log.v(TAG, "Start playing video via Java Bridge");
}

そしてあなたのHTMLで：

document.getElementById("video-player").addEventListener('loadedmetadata', vidLoad, false);
....
function vidLoad() {
    document.getElementById("video-player").removeEventListener('loadedmetadata', vidLoad, false)
    // use a Java method to trigger "play" on the video via JavaScriptInterface
    appChannel.vidLoaded();
}
于 2014-10-21T18:45:56.057 に答える
1

Amazon と Android WebView の両方で、メディアの再生を開始するには、デフォルトでユーザーのジェスチャー (キーまたはボタンを押す) が必要なようです。この動作は、次のようにWebSettingsオブジェクトのsetMediaPlaybackRequiresUserGesture(false)メソッドを呼び出すことで変更できます。

AmazonWebSettings browserSettings = webView.getSettings();
browserSettings.setMediaPlaybackRequiresUserGesture(false);

このようにして、HTML5 アプリで JavaScript コードを使用して (Java を使用せずに) ビデオを再生/一時停止できます。

document.getElementById('player').addEventListener('canplaythrough', function () {
    this.play();
    console.log('canplaythrough: Player started');
}, false);
于 2014-10-23T07:54:31.297 に答える