Android下java方法和JS方法的互调

最新推荐文章于 2023-04-10 17:01:12 发布

mufeng_慕枫

最新推荐文章于 2023-04-10 17:01:12 发布

阅读量817

点赞数 2

分类专栏： Android Android项目实战基地文章标签： android webview js html javascript

本文链接：https://blog.csdn.net/u013693649/article/details/44037293

版权

Android 同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

Android项目实战基地

15 篇文章 6 订阅

订阅专栏

Android手机中内置了一款高性能webkit内核，该内核完美封装到了WebView组件中。而在Android中的java方法调用JS方法或者在JS中调用Android中的java方法都离不开webview。下面以一个小DEMO来介绍它们之间的调用。

1.首先是布局文件activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="6" />

    <ScrollView
        android:id="@+id/tv_sv"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3" >

        <TextView
            android:id="@+id/tv"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:text="JS调用Android 里的JAVA方法：" />
    </ScrollView>

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="Android 里的java调用js方法" />

</LinearLayout>

2.在assets目录下新建一个index.html文件

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<script type="text/javascript">
function javacalljs(){
document.getElementById("content").innerHTML +=   
         "<br\>Android里的java方法调用了js方法（无参）";
}


function javacalljswithargs(arg){
document.getElementById("content").innerHTML +=   
         ("<br\>"+arg);
}


</script>
</head>
<body style="font-size:32px">
this is my html <br/>
<a onClick="window.my.startFunction()">点击HTML里的按钮调用Android里的java方法（无参）</a><br/>
<a onClick="window.my.startFunction(' come from Android java ')" >点击HTML里的按钮调用Android里的的java方法并传递参数</a>
<br/>
<div id="content">显示JS调用Android方法的列表：</div>
</body>
</html>

3.接着是MainActivity

package com.android2js;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.view.View.OnClickListener;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.TextView;
import android.annotation.SuppressLint;
import android.app.Activity;


public class MainActivity extends Activity {


private WebView myWebView;
private TextView myTv;
private Button jsBtn;


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
setWebView();
}


@SuppressLint({ "SetJavaScriptEnabled", "JavascriptInterface" })
private void setWebView() {
myWebView = (WebView) findViewById(R.id.webview);
myTv = (TextView) findViewById(R.id.tv);
jsBtn = (Button) findViewById(R.id.button);


// JavaScript使能（如果加载的页面中有JS代码，则必须使能JS）
WebSettings webSettings = myWebView.getSettings();
// 启用javascript
webSettings.setJavaScriptEnabled(true);
webSettings.setUseWideViewPort(true);
webSettings.setLoadWithOverviewMode(true);


// 在WebView中打开连接（默认行为是使用浏览器，设置此项后都用WebView打开）
myWebView.setWebViewClient(new WebViewClient());


// 从assets目录下面的加载html
myWebView.loadUrl("file:///android_asset/index.html");


myWebView.addJavascriptInterface(this, "my");


jsBtn.setOnClickListener(new OnClickListener() {


@Override
public void onClick(View v) {


// 无参数调用
myWebView.loadUrl("javascript:javacalljs()");
// 传递参数调用
myWebView.loadUrl("javascript:javacalljswithargs("
+ "'come from JS'" + ")");
}
});
}


/**
* 用于JS中调用的无参java方法 记住Android4.2以上版本一定要在方法前加上@JavascriptInterface
*/
@JavascriptInterface
public void startFunction() {
runOnUiThread(new Runnable() {


@Override
public void run() {
myTv.setText(myTv.getText() + "\njs调用了java函数");


}
});
}


/**
* 用于JS中调用的带参java方法 记住Android4.2以上版本一定要在方法前加上@JavascriptInterface
*/
@JavascriptInterface
public void startFunction(final String str) {
runOnUiThread(new Runnable() {


@Override
public void run() {
myTv.setText(myTv.getText() + "\njs调用了java函数传递参数：" + str);


}
});
}


}

PS:Android中用于JS调用的方法前一定要加@JavascriptInterface（Android4.2级以上版本）
运行项目即可成功