WebView の上にフレーム レイアウトを作成し、VideoView にアタッチすることができます。このようにして、サイズを管理し、カスタム MediaControls を追加できますが、多くの作業があり、多くの問題に直面します。
編集:次の方法でイベントをキャプチャできます。
HTML を処理できる場合は、JS ブリッジを介してアプリケーション メソッドを呼び出す JS メソッドを追加できます。例として、イベント付きの画像を配置しonclick
ます。アプリでこの画像呼び出しをクリックしJsVideFrameCallbackImpl.playVideo('videoUrl')
ます ( 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')">
addJavascriptInterface
あなたの活動を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));
}
}
または、同じ js-bridge を介してページ上の任意の html 要素の座標を取得し、配置することもできますVideoView
( FrameLayout
webview で js を有効にすることを忘れないでくださいwv.getSettings().setJavaScriptEnabled(true); before using javascript in webview
)。
wv.loadUrl("javascript: jsInitMedia()"); // call js method jsInitMedia
html の jsInitMedia (または、このコードを次のように WebView に直接適用できます: 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);
}
そしてあなたのJavaコードで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
}