WebView提供了在Android應(yīng)用中展示網(wǎng)頁(yè)的強(qiáng)大功能。也是目前Hybird app的大力發(fā)展的基礎(chǔ)。作為Android系統(tǒng)的一個(gè)非常重要的組件,它提供兩方面的強(qiáng)大的能力:對(duì)HTML的解析,布局和繪制;對(duì)JavaScript的解釋和執(zhí)行。Hybird App的組成是Native+H5,Native部分是java語(yǔ)言實(shí)現(xiàn);而Javascript是H5中必不可少的部分。因此就會(huì)遇到Java與JavaScript互相調(diào)用的情況!這里記錄了一個(gè)最基本的互相調(diào)用的例了!
1.Native布局中添加WebView組件
1 <WebView2 android:id="@+id/wv_contacts"3 android:layout_below="@id/tv_title"4 android:layout_width="match_parent"5 android:layout_height="match_parent">6 </WebView>
2.初始化WebView,設(shè)置允許使用JavaScript并載入頁(yè)面
1 PRivate void initWebView() {2 mWebView = (WebView) findViewById(R.id.wv_contacts);3 WebSettings settings = mWebView.getSettings();4 settings.setJavaScriptEnabled(true);5 mWebView.loadUrl("file:///android_asset/constacts.html");6 }
3.java調(diào)用javaScript(mWebView.loadUrl("javascript:method(param)");)首先定義好JavaScript函數(shù):
1 function showData(constactsData){2 var html="";3 var ullist = document.getElementById("contacts_list");4 var constactsJsonData = eval(constactsData);5 for(var i = 0; i < constactsJsonData.length; i++){6 html += "<li onclick=callPhone(/"" + constactsJsonData[i].number + "/")>" + constactsJsonData[i].name + "</li>";7 }8 ullist.innerHTML = html;9 }然后在java調(diào)用JavaScript,放在onPageFinished回調(diào)中調(diào)用是為了保證,調(diào)用Js時(shí),Js已全部加載完成
1 mWebView.setWebViewClient(new WebViewClient() { 2 @Override 3 public boolean shouldOverrideUrlLoading(WebView view, String url) { 4 view.loadUrl(url); 5 return true; 6 } 7 8 @Override 9 public void onPageFinished(WebView view, String url) {10 super.onPageFinished(view, url);11 showContactsInfo();12 }13 });14 15 private void showContactsInfo() {16 String info = jsInterface.readContacts();17 mWebView.loadUrl("javascript:showData(" + info + ")");18 }4.在Js中調(diào)用Java(mWebView.addJavascriptInterface(new JavaScriptInterface(), "interface");)。如代碼所示,在Js中調(diào)用Java Native方法。需要將需要調(diào)用的方法所屬對(duì)象轉(zhuǎn)化為一個(gè)別名。將這個(gè)別名透?jìng)鞯絁avaScript中,然后在JavaScript中通過(guò)別名訪問(wèn)Native方法。
首先添加別名
1 mWebView.addJavascriptInterface(new JSInterface(this.getapplicationContext()), "jsinterface");然后定義Native方法
1 public void callPhone(String number) {2 Intent intent = new Intent(Intent.ACTION_CALL, Uri.parse("tel:" + number));3 intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);4 mContext.startActivity(intent);5 }最后通過(guò)別名在JavaScript中進(jìn)行調(diào)用1 function callPhone(number){ 2 jsinterface.callPhone(number); 3 }
如果便完成了Hybird App中的最基本的Java和JavaScript的通信的功能!
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注