Android五分鐘輕松教會你掌握WebView與JS交互
背景:Android API中提供了WebView組件來實現(xiàn)對html的渲染?,F(xiàn)在HTML5、CSS3、jS的相關(guān)開發(fā)技術(shù),以及數(shù)據(jù)交換格式j(luò)son/XML。Web開發(fā)工程師的技能。為了減少對android的過度依賴,通常會在原生的Android 嵌入部分的html了。
這樣一來就避免不了為js數(shù)據(jù)交互。
我們新建一個簡單的布局,只有一個webview控件
- <android:id="@+id/webView"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- />
我們找到這個webView,并加上載本地的main.html,其中main.html存儲在工程文件的assets根目錄下。
- WebView webView = (WebView) findViewById(R.id.webView);
- webView.addJavascriptInterface(newJSObject(context), "aikaifa");
- WebSettings webSettings = webView.getSettings();
- webSettings.setJavaScriptEnabled(true);// 支持js
- Handler handler = new Handler();
- handler.postDelayed(new Runnable() {
- public void run() {
- webView.loadUrl("file:///android_asset/main.html");
- }
- }, 500);
1.js調(diào)用Android方法
細(xì)心的你應(yīng)該會注意到上面有個JSObject類,沒錯,就是這個開啟了入口,前端js 才可以調(diào)用我們Android這邊寫的方法。其中的“aikaifa” 可以理解成一個標(biāo)示,可以隨便改成你喜歡的。
我們來看一下JSObject這個類:
- public class JSObject {
- private Context context;
- public JSObject(Context context){
- this.context=context;
- }
- @JavascriptInterface
- public void goBack({
- Activity activity = (Activity) context;
- activity.finish();
- }
- }
該類定義了goBack方法,注入JS可以調(diào)用。
js如果想要調(diào)用goBack這個方法??梢赃@個aikaifa.goBack() 這樣調(diào)用即可。
這樣前端就可以很方便調(diào)用我們Android這邊的方法了。
2.Android調(diào)用JS方法
既然js可以調(diào)用我們的方法,那我們同樣也調(diào)用js方法
例如我們想調(diào)用js 中g(shù)etName方法。
我們可以這樣寫。
- public void getTestJS()
- {
- Timertimer = new Timer();
- final Handler handler = new Handler(){
- public void handleMessage(Message msg) {
- switch (msg.what) {
- case 1:
- webView.loadUrl("javascript:getName()");
- break;
- }
- super.handleMessage(msg);
- }
- };
- timer.schedule(new TimerTask() {
- public void run() {
- Message msg = new Message();
- msg.what = 1;
- handler.sendMessage(msg);
- }
- }, 500, 500);
- }
其中g(shù)etName方法是js中的一個方法,我們可以在需要的地方調(diào)用getTestJS方法就可以了。
這樣WebView與js交互就大致完成了。
【本文為51CTO專欄作者“洪生鵬”的原創(chuàng)稿件,轉(zhuǎn)載請聯(lián)系原作者】






























