facebook twitter hatena line google mixi email

Android/webview/jsから端末のメソッド呼出

提供: 初心者エンジニアの簡易メモ
移動: 案内検索

webviewから端末側へのjs連携。webviewのリンクをクリックするとToastメッセージ表示するサンプル

  • src/info/nonip/android/lib/entity/WebViewJs.java
package info.nonip.android.lib.entity;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebSettings.LayoutAlgorithm;
import android.content.Context;
/**
 * WebViewJs
 *
 * WebView webView = (WebView) findViewById(R.id.webview1);
 * WebViewJs webViewJs = new WebViewJs(getApplicationContext());
 * webViewJs.setWebView(webView);
 * webViewJs.addJavascriptInterface(new SampleWebViewInterface(getApplicationContext()));
 * webViewJs.loadUrl("file:///android_asset/index.html");
 */
public class WebViewJs {
  private Context mContext;
  private WebView mWebView;
  private String mUrl = "file:///android_asset/index.html";
  public WebViewJs(Context context) {
    mContext = context;
  }
  // WebView指定
  public void setWebView(WebView webView) {
    mWebView = webView;
  }
  // URL指定
  public void setUrl(String url) {
    mUrl = url;
  }
  /**
   * js戻りクラスメソッド追加
   * @param webViewInterface new SampleWebViewInterface(getApplicationContext());
   */
  public void addJavascriptInterface(Object webViewInterface) {
    // javascriptから_androidというオブジェクトを扱えるようになります
    mWebView.addJavascriptInterface(webViewInterface, "_android");
  }
  // ページロード
  public void load() {
    loadUrl(mUrl);
  }
  // ページロード(URL指定
  public void loadUrl(String url) {
    addSetting();
    mWebView.loadUrl(mUrl);
  }
  // 解放
  public void release() {
    mWebView = null;
    mContext = null;
  }
  // 設定追加
  private void addSetting() {
    // webViewの設定
    WebSettings setting = mWebView.getSettings();
    // javascript有効
    setting.setJavaScriptEnabled(true);
    // window.open()有効
    setting.setJavaScriptCanOpenWindowsAutomatically(true);
    // レイアウト設定
    setting.setLayoutAlgorithm(LayoutAlgorithm.NORMAL);
    // ズーム不可
    setting.setBuiltInZoomControls(false);
  }
}
  • src/info/nonip/android/AndroidHelloworld1/SampleWebViewInterface.java
package info.nonip.android.AndroidHelloworld1;
import android.content.Context;
import android.widget.Toast;
import android.util.Log;
/**
 * サンプルwebviewインターフェイス
 */
class SampleWebViewInterface {
  private Context mContext;
  public SampleWebViewInterface(Context context) {
    mContext = context;
  }
  /**
   * log出力
   * @param msg
   */
  public void log(String msg) {
    Log.d("SampleWebViewInterface", msg);
  }
  /**
   * メッセージ表示
   * @param msg
   */
  public void message(String msg) {
    // 5秒程度メッセージを出す
        Toast.makeText(mContext, msg, Toast.LENGTH_LONG).show();
  }
}
  • src/info/nonip/android/AndroidHelloworld1
package info.nonip.android.AndroidHelloworld1;
import info.nonip.AndroidHelloworld11.SampleWebViewInterface;
import info.nonip.android.lib.entity.WebViewJs;
import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;
import android.util.Log;
public class AndroidHelloworld1Activity extends Activity {
  /** Called when the activity is first created. */
  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    WebView webView = (WebView) findViewById(R.id.webview1);
    WebViewJs webViewJs = new WebViewJs(getApplicationContext());
    webViewJs.setWebView(webView);
    webViewJs.addJavascriptInterface(new SampleWebViewInterface(getApplicationContext()));
    webViewJs.loadUrl("file:///android_asset/index.html");
  }
}
  • assets/index.html
<html><head><meta http-equiv='content-type' content='text/html;charset=UTF-8'>
<title>AndroidInterfaceSample</title></head><body>
<script type="text/javascript">
// AndroidインターフェイスJS
function AndroidIntarface() {}
// メッセージ表示
AndroidIntarface.prototype.message = function(msg) {
  // 端末側メッセージ表示呼出
  _android.message(msg);
};
var androidIntarface = new AndroidIntarface();
</script>
<a onClick="androidIntarface.message('hoge');return false;">ここをクリック</a><br />
<a onClick="androidIntarface.message('hogehoge');return false;"><img src="ic_launcher.png" alt="クリック" /></a><br />
</body></html>