Android
webView

Android Webviewで表示している画像サイズを取得する

More than 3 years have passed since last update.

advent_calender_5.png

Goodpatch Advent Calendar 5日目の投稿です。

こんにちは。@hi6484です。

Goodpatchで日々Androidアプリを作ってます。

今年度、Androidアプリを作っていてハマったポイントです。

WebViewとかで辛い思いをするのは嫌なんで、

実装を諦めようかとおもったのですが、なんやかんやで実装できました。

実装できたため、Advent Calendarにも参加できる幸せものです。


要件

とある ウェブページの画像を表示させる(簡単にいうとInterstitial広告)

広告SDKはあるんですが、interstitial未対応なため、アプリ側で実装。

画像サイズは可変。もちろんJSで動く

iOS側では既に実装済みで、画像サイズを取得するのは下記のような感じ。

CGSize contentSize = CGSizeMake([[webView

stringByEvaluatingJavaScriptFromString:
@"document.body.scrollWidth;"] floatValue],
[[webView stringByEvaluatingJavaScriptFromString:
@"document.body.scrollHeight;"] floatValue]);


Android

Androidでどうやるのか。

Android4.4(Kitkat)以上に対応しております。

それ以下の実装方法を知っている方がいましたら教えてください。

XML

<?xml version="1.0" encoding="utf-8"?>

<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/interstitial_view"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:background="#B2000000"
>
<WebView
android:id="@+id/web_view"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
</FrameLayout>

ここで重要なのはandroid:layout_width="0dip"となります。

ここをwrap_contentやmatch_parentと指定しておくと、

画面サイズより小さい画像の場合は画面の横幅が取得されます。

JAVA

    private void loadWebView() {

WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
mWebView.setWebViewClient(new SampleWebViewClient());
String url = "http://wwww.hogehoge.com/image";
mWebView.loadUrl(url);
}

private class SampleWebViewClient extends WebViewClient {
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
// 余白を消す.
mWebView.evaluateJavascript(
              "javascript:document.body.style.margin='0';",
null);

// 高さを取得.
String heightScript =
"javascript:document.body.scrollHeight;";
mWebView.evaluateJavascript(heightScript,
new ValueCallback<String>()
{
@Override
public void onReceiveValue(String value) {
mHeight = Integer.valueOf(value);
}
});
// 幅を取得.
String widthScript =
"javascript:document.body.scrollWidth;";
mWebView.evaluateJavascript(widthScript,
new ValueCallback<String>()
{
@Override
public void onReceiveValue(String value) {
mWidth = Integer.valueOf(value);
}
});

}
}
}

Android4.4より追加された、WebView.evaluateJavascript(String script, ValueCallback resultCallback)に、

scriptを渡して、結果をcallbackで受け取るだけ。

明日はGoodpatchのiOSエンジニア @eedawa が英語?でiOSの事を書いてくれます。

お楽しみに!!!