# Android向けの実装
# 基本実装
プレイヤーの基本的な機能を使用するために必要な実装を行います。本章内の以降のアプリの実装例は、基本実装がされている前提とします。
AndroidManifest.xmlでのパーミッションの設定
<uses-permission android:name="android.permission.INTERNET" />
WebView関連
WebViewインスタンスに必要な設定をしたうえで、プレイヤーを配置するWebページを表示します。
実装例は以下の通りです。
// WebViewのインスタンスを取得する。
WebView webView = findViewById(R.id.webView);
// JavaScriptを有効にする。
webView.getSettings().setJavaScriptEnabled(true);
// プレイヤーを配置するWebページを表示する。
webView.loadUrl("https://host/path/playerpage.html");
# フルスクリーン
WebView上のプレイヤーでフルスクリーン表示する際の拡大方式に 'native' を指定している場合、フルスクリーンボタンが反応しません。反応させるには、アプリに以下の実装を行います。
WebChromeClientインスタンスの設定
以下2. 〜 3. のコールバックメソッドをオーバーライドしたWebChromeClientインスタンスをWebViewに設定します。
WebChromeClient#onShowCustomView()
メソッドフルスクリーン表示する際にコールされます。第一引数でフルスクリーン状態のViewが渡されるので、Viewを見える状態にします。
WebChromeClient#onHideCustomView()
メソッドフルスクリーン表示を解除する際にコールされます。フルスクリーン状態のViewを削除します。
実装例は以下の通りです。
// 本実装例の外でViewGroup rootViewを宣言している。
// WebChromeClientインスタンスをWebViewに設定する。
webView.setWebChromeClient(new WebChromeClient() {
View fullscreenView;
@Override
public void onShowCustomView(View view, CustomViewCallback callback) {
// フルスクリーン状態で行いたい処理を書く。
// アクションバーや画面の向きの調整等
// フルスクリーン状態のviewを被せて見える状態にする。
rootView.addView(view);
fullscreenView = view;
}
@Override
public void onHideCustomView() {
// 非フルスクリーン状態で行いたい処理を書く。
// アクションバーや画面の向きの調整等
// フルスクリーン状態のviewを削除する。
rootView.removeView(fullscreenView);
fullscreenView = null;
}
};
# リニア広告
Webページ内のリンクを開く際にWebView内で遷移する設定の状態において、WebView上のプレイヤーでリニア広告の再生中に広告のWebページへ遷移するリンクを開くとWebView内に表示します。ブラウザで遷移先のWebページを開くには、アプリに以下の実装を行います。
マルチウィンドウの設定
マルチウィンドウを許可します。
WebChromeClientインスタンスの設定
以下3. のコールバックメソッドをオーバーライドしたWebChromeClientインスタンスをWebViewに設定します。
WebChromeClient#onCreateWindow()
メソッドブラウザで遷移先のWebページを開く際にコールバックされます。WebページのURLを取得するために別のWebViewインスタンスを生成し、以下4. のコールバックメソッドをオーバーライドしたWebViewClientインスタンスを設定します。また、4. のメソッドがコールバックされるために必要な設定を、生成したWebViewインスタンスに対して行います。
WebViewClient#onPageStarted()
メソッド遷移先のWebページの読み込みを開始した際にコールバックされます。第二引数からWebページのURLを取得し、ブラウザを起動します。
Webページ内のリンクを開く際にWebView内で遷移する設定
以下6. のコールバックメソッドをオーバーライドしたWebViewClientインスタンスをWebViewに設定します。
WebViewClient#shouldOverrideUrlLoading()
メソッド別のWebページへ遷移する際にコールバックされます。親クラスの同メソッドをコールするとWebView内で遷移します。1. 〜 4. を実装している場合、広告のWebページへ遷移するリンクを開いても本メソッドはコールされません。
実装例は以下の通りです。
// マルチウィンドウを許可する。
webView.getSettings().setSupportMultipleWindows(true);
// WebChromeClientインスタンスをWebViewに設定する。
webView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onCreateWindow(WebView view, boolean isDialog, boolean isUserGesture, Message resultMsg) {
// 別のWebViewインスタンスを生成する。
WebView targetWebView = new WebView(getApplicationContext());
targetWebView.setWebViewClient(new WebViewClient() {
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
// WebページのURLを設定した暗黙的インテントを使用してアプリ間遷移します。
Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
startActivity(intent);
}
});
// onPageStarted()がコールバックされるために必要な設定を行う。
WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj;
transport.setWebView(targetWebView);
resultMsg.sendToTarget();
return true;
}
});
// Webページ内のリンクを開く際にWebView内で遷移させる。
webView.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
return super.shouldOverrideUrlLoading(view, request);
}
});
# ポスター画像
WebView上のプレイヤーでポスター画像を指定しない場合、WebViewデフォルトのポスター画像が表示されます。ブラウザ上で動作させる場合と振る舞いを合わせるには、アプリに以下の実装を行います。なお、当該実装を行う場合でもポスター画像を指定していればポスター画像を表示します。
WebChromeClientインスタンスの設定
以下2. のメソッドをオーバーライドしたWebChromeClientインスタンスをWebViewに設定します。
WebChromeClient#getDefaultVideoPoster()
メソッドWebページをロードする際、ポスター画像が指定されていない場合にコールバックされます。ファーストフレームが見えるように透明な画像を返却します。
実装例は以下の通りです。
// WebChromeClientインスタンスをWebViewに設定する。
webView.setWebChromeClient(new WebChromeClient() {
@Override
public Bitmap getDefaultVideoPoster() {
// 透明な画像を返却する。
return Bitmap.createBitmap(1, 1, Bitmap.Config.ARGB_8888);
}
});
# ビューポート
Webページに記述するビューポート設定 <meta name="viewport" content="...">
を有効にするには、アプリに以下の実装を行います。
ビューポートの設定
Webページに記述するビューポート設定を有効にします。
実装例は以下の通りです。
// Webページに記述するビューポート設定を有効にする。
webview.getSettings().setUseWideViewPort(true);