Android関連 > WebView内のjavaScriptからネイティブのメソッドを呼び出す(Android) WebView内のjavaScriptからネイティブのメソッドを呼び出す(Android) †Activity側でWebViewの設定を行う †public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { ・ ・ WebView webview = (WebView) findViewById(R.id.webView1); // webviewでのjavascript使用を可能にする webview.getSettings().setJavaScriptEnabled(true); // ここで指定した名前で呼び出す事が出来る webview.addJavascriptInterface(new MainJsInterface(this), "Android"); ・ } } javaScript から呼び出す処理の記述 †public class MainJsInterface { Activity activity; // 引数から activity への参照を得ていた方が都合が良い? MainJsInterface(Activity a){ activity = a; } /** * Toastを表示する。 */ @JavascriptInterface public void showToast(String toast) { Toast.makeText(activity, toast, Toast.LENGTH_SHORT).show(); } /** * 引数から得た2つの数値を加算したものを返却する。 * @param num1 数値1 * @param num2 数値2 * @return 結果 */ @JavascriptInterface public int sum(int num1, int num2) { return num1 + num2; } /** * 引数から数値の配列を取得するサンプル。 * @param numAll 数値配列 * @return メッセージ */ @JavascriptInterface public String numListArg(int[] numAll){ Log.d("DEBUG", "numListArg!"); String result = ""; String delimit = ""; for (int num : numAll) { result += delimit + num; delimit = "と"; } return result + "を受け取りました"; } /** * 引数から文字列の配列を取得するサンプル。 * @param strAll 数値配列 * @return メッセージ */ @JavascriptInterface public String strListArgs(String[] strAll){ Log.d("DEBUG", "numListArg!"); String result = ""; String delimit = ""; for (String str : strAll) { result += delimit + str; delimit = "と"; } return result + "を受け取りました"; } /** * 引数からJSONを取得するサンプル。 * @param args JSON文字列 * @return メッセージ */ @JavascriptInterface public String mapArg(String args){ Log.d("DEBUG", "mapArgs!"); String result = ""; try { if (args == null) { result = "NULLを受け取りました"; } else { // Mapの受け渡しが出来ない為、JSON文字列として取得する JSONObject json = new JSONObject(args); java.util.Iterator it = json.keys(); while (it.hasNext()) { String key = (String)it.next(); Object obj = json.get(key); String type = obj.getClass().getSimpleName(); result += key + "として" + obj + "(" + type + ")を受け取りました<br />"; } } } catch (Exception e){ e.printStackTrace(); } return result; } /** * 戻り値として List を返却するサンプル。 * @return JSON文字列 */ @JavascriptInterface public String resultList(){ Log.d("DEBUG", "resultList!"); List list = new java.util.ArrayList(); list.add("A"); list.add("B"); list.add("C"); // List はそのまま返却できない為、JSON文字列として返却する。 JSONArray jsonList = new JSONArray(list); return jsonList.toString(); } /** * 戻り値として Map を返却するサンプル。 * @return JSON文字列 */ @JavascriptInterface public String resultMap(){ Log.d("DEBUG", "resultMap!"); Map map = new java.util.HashMap(); map.put("A", "111"); map.put("B", "222"); // Map はそのまま返却できない為、JSON文字列として返却する。 JSONObject jsonMap = new JSONObject(map); return jsonMap.toString(); } } HTML側の記述 †<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script src="./jquery.js"></script> <script type="text/javascript"> $(function(){ $(document).on("click", "#showToastBtn", function(){ console.log("showToastBtn!"); if (Android.showToast){ Android.showToast("TEST2"); } }); // Android側の 数値加算メソッドを呼び出す $(document).on("click", "#callSum", function(){ var result = Android.sum(1,2); $("#result").text(result); }); // Android側の関数に数値配列を受け渡すサンプル $(document).on("click", "#callNumListArg", function(){ var args = { "param1" : "A", "list" : [1,2,3]}; var result = Android.numListArg([1,2,3]); $("#result").text(result); }); // Android側の関数に文字列配列を受け渡すサンプル $(document).on("click", "#callStrListArgs", function(){ var args = { "param1" : "A", "list" : [1,2,3]}; var result = Android.strListArgs(["A","B","C"]); $("#result").text(result); }); // Android側の関数にJSONを受け渡すサンプル $(document).on("click", "#callMapArg", function(){ var args = { "param1" : "A", "list" : [1,2,3], "list2" : [1,"B",3]}; var result = Android.mapArg(JSON.stringify(args)); // 文字列に変換して受け渡す $("#result").html(result); }); // Android側から List を受け取るサンプル $(document).on("click", "#callResultList", function(){ var result = Android.resultList(); var list = JSON.parse(result); // 文字列として受け取った結果をJSONに変換する var resultInfo = ""; for (var i in list) { resultInfo = resultInfo + (parseInt(i,10)+1) + "行目 = " + list[i] + "<br />"; } $("#result").html(resultInfo); }); // Android側から Map を受け取るサンプル $(document).on("click", "#callResultMap", function(){ var result = Android.resultMap(); var map = JSON.parse(result); // 文字列として受け取った結果をJSONに変換する var resultInfo = ""; for (var k in map) { resultInfo = resultInfo + k + "は" + map[k] + "<br />"; } $("#result").html(resultInfo); }); }); </script> </head> <body> <input id="showToastBtn" type="button" value="Show Toast" /> <br /> <input id="callSum" type="button" value="callSum" /> <br /> <input id="callNumListArg" type="button" value="callNumListArg"/> <br /> <input id="callStrListArgs" type="button" value="callStrListArgs"/> <br /> <input id="callMapArg" type="button" value="callMapArg" /> <br /> <input id="callResultList" type="button" value="callResultList" /> <br /> <input id="callResultMap" type="button" value="callResultMap" /> <hr /> <div id="result"></div> </body> </html> JavaScript から Android 側に受け渡せるデータ型 †文字列、数値 および その配列が受け渡し可能。
※double型で浮動小数点も受け渡し可能。 |