HTML/JS 调用android方法,开发 Android。

初次尝试用HTML/JS开发Android。

由于业务需求和大趋势导致,目前纵观很多APP。很多都是用H5+native的方式去开发。关于wepApp和nativeApp它们之前的是是非非就不说了。

下面是利用H5应该是JS去调用本地Android的代码。

不是什么特别高深的东西。

第一布局:

复制代码
 1 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
 3     android:layout_height="match_parent" tools:context=".MainActivity">
 4 
 5    <WebView
 6        android:id="@+id/wv_web"
 7        android:layout_width="match_parent"
 8        android:layout_height="match_parent"></WebView>
 9 
10 </RelativeLayout>
复制代码

第二native代码。

复制代码
 setContentView(R.layout.activity_main);
        webView = (WebView) findViewById(R.id.wv_web);
        webView.loadUrl("file:///android_res/raw/test.html");
        webView.setVerticalScrollBarEnabled(false);
        webView.setHorizontalScrollBarEnabled(false);
        webView.getSettings().setJavaScriptEnabled(true); //加上这句话才能使用javascript方法;
        webView.addJavascriptInterface(new PayJavaScriptInterface(), "demo");
复制代码
复制代码
 1  final class PayJavaScriptInterface {
 2         PayJavaScriptInterface() {
 3         }
 4         @JavascriptInterface
 5         public String getUserinfo()  {
 6             return "getUserinfo";
 7         }
 8 
 9 
10         @JavascriptInterface
11         public boolean needLogin()  {
12             return true;
13         }
14         @JavascriptInterface
15         public void haha()  {
16             Toast.makeText(MainActivity.this,"hahaa",Toast.LENGTH_SHORT).show();
17             Log.e("sssssssssssssssssssssss","sdfddddddddd");
18         }
19     }
复制代码

第三HTML里面的代码:

test.html

复制代码
<!DOCTYPE HTML>
<html>

<head>

    <meta charset="UTF-8">

    <title>交互Demo</title>

    <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" name="viewport">

</head>



<body>

getUserinfo:

<div id="userinfo"></div>

<input value="立即报名" type="button" onClick="baoming();" /><br>



<script>

/*var rs=window.om.getUserinfo();

document.getElementById('userinfo').innerHTML=rs;*/

var rs=window.demo.getUserinfo();

var obj = eval ("(" + rs + ")");

if(obj.status){

document.getElementById('userinfo').innerHTML=obj.data.nickname;

}

function baoming(){

if(window.demo.needLogin()){

location.href='test1.html';

}

}

</script>

</body>

</html>
复制代码

test1.html代码:

复制代码
 1 <!DOCTYPE HTML>
 2 <html>
 3 <body>
 4 <input value="立即报名" type="button" onClick="haha();"/>
 5 
 6 </body>
 7 
 8 <script>
 9 
10 function haha(){
11 
12 window.demo.haha();
13 
14 }
15 
16 </script>
17 
18 </html>
复制代码

这样就可以实现了。

需要注意的点:

1.这里我加载的是本地app里面的html,所以使用的方式是

   webView.loadUrl("file:///android_res/raw/test.html");

关于加载网页的可以直接,写上url,而我的html是的放在raw目录里面。使用的AndroidStudio。

2.设置了下webView的相关配置信息。具体代码有备注,或者可以查阅其他相关资料。

3.在本地写:

webView.addJavascriptInterface(new PayJavaScriptInterface(), "demo");

其中第一个参数就是我下面写的一个类,第二个参数是在HTML里面的JS需要使用的。注意,在HTML里面我window后面跟的demo和这里是一样的,也必须保持一致才能成功调用。


然后就是你在JS里面调用了。这样应该就ok了。今天还继续研究下这玩意。


突然感觉不是特别清晰,这样说吧,这个demo这个就代码我们第一个参数new出的对象,然后我们在JS里面写window.demo,代表我PayJavaScriptInterface这个对象的实例,也就是我在第一个参数这边new出来的。然后再window.demo.haha();其实就是调用了PayJavaScriptInterface里面的haha的方法。然后就执行haha里面的代码。

这样表达应该还算清晰!
优秀的个人博客,低调大师

微信关注我们

原文链接:https://yq.aliyun.com/articles/69840

转载内容版权归作者及来源网站所有!

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

相关文章

发表评论

资源下载

更多资源
Oracle Database,又名Oracle RDBMS

Oracle Database,又名Oracle RDBMS

Oracle Database,又名Oracle RDBMS,或简称Oracle。是甲骨文公司的一款关系数据库管理系统。它是在数据库领域一直处于领先地位的产品。可以说Oracle数据库系统是目前世界上流行的关系数据库管理系统,系统可移植性好、使用方便、功能强,适用于各类大、中、小、微机环境。它是一种高效率、可靠性好的、适应高吞吐量的数据库方案。

Apache Tomcat7、8、9(Java Web服务器)

Apache Tomcat7、8、9(Java Web服务器)

Tomcat是Apache 软件基金会(Apache Software Foundation)的Jakarta 项目中的一个核心项目,由Apache、Sun 和其他一些公司及个人共同开发而成。因为Tomcat 技术先进、性能稳定,而且免费,因而深受Java 爱好者的喜爱并得到了部分软件开发商的认可,成为目前比较流行的Web 应用服务器。

Java Development Kit(Java开发工具)

Java Development Kit(Java开发工具)

JDK是 Java 语言的软件开发工具包,主要用于移动设备、嵌入式设备上的java应用程序。JDK是整个java开发的核心,它包含了JAVA的运行环境(JVM+Java系统类库)和JAVA工具。

Sublime Text 一个代码编辑器

Sublime Text 一个代码编辑器

Sublime Text具有漂亮的用户界面和强大的功能,例如代码缩略图,Python的插件,代码段等。还可自定义键绑定,菜单和工具栏。Sublime Text 的主要功能包括:拼写检查,书签,完整的 Python API , Goto 功能,即时项目切换,多选择,多窗口等等。Sublime Text 是一个跨平台的编辑器,同时支持Windows、Linux、Mac OS X等操作系统。