![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
|
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();
}
/**
* 引数から得た２つの数値を加算したものを返却する。
* @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型で浮動小数点も受け渡し可能。 |
