安卓与HTML简单的交互使用

实现通过java代码与HTML的一个互相操作。

准备工作：

1、新建Android工程，在布局文件中添加WebView控件。

2、准备一个HTML文件，放在src/main/assets文件夹下。

3、在java中得到webview，通过loadUrl找到assets下的HTML文件，必须设置webview能使用js(settings.setJavaScriptEnabled(true))加载显示如下效果：

简单的效果实现

一、点击HTML上sayHello按钮，可以得到java代码返回的字符串并显示

1 mWvShow.loadUrl("file:///android_asset/jsandjava.html");
2 mWvShow.addJavascriptInterface(new JsTest(), "jsObj");//将java中类映射到js中   jsObj为该类的一个对象名

JsTest是一个内部类，其中定义的方法与js中button调用的方法名一致。

1         @JavascriptInterface
2         public String sayHello() {
3             return "你好！！！";
4         }

js中封装的sayHello()方法：

1    function sayHello(){
2       var str = window.jsObj.sayHello();
3       document.getElementById("id_input").value = str;
4    }

var str = window.jsObj.sayHello();

通过window得到jsObj对象，通过其调用该类中的方法sayHello()，就可获取java方法中返回的字符串。

在js的button点击时调用方法：

1 <input type="button" value="sayHello" onclick="sayHello()"/>

演示效果：

二、点击HTML上showAndroidButton按钮，可以和activiy交互，让其进行一些UI的操作

因对象映射过一次，不需再次映射。在java中定义showAndroidButton（）方法，同样方法名需和js中button调用的一致，即js调用的方法就是通过映射过去的对象调用的java里的方法，所以两者方法名必须一致。因为showAndroidButton（）是在js中通过映射的对象来调用，不能直接更新UI需要通过runOnUiThread的方法来更新UI。

1         @JavascriptInterface
2         public void showAndroidButton(){
3             runOnUiThread(new Runnable() {
4                 @Override
5                 public void run() {
6                     btn_test.setVisibility(View.VISIBLE);
7                 }
8             });
9         }

js封装的方法：

通过对象调用类中的方法。

1    function showAndroidButton(){
2        window.jsObj.showAndroidButton();
3    }

HTML中button的定义，调用showAndroidButton()方法：

<input type="button" style="height: 40px "  value="showAndroidButton" onclick="showAndroidButton()"/>

三、点击excuteHtmlFun按钮，调用java内的excuteHtmlFun()方法，方法内调用js定义的showFromHtml(param)方法；

java内部类中的excuteHtmlFun()方法，方法内加载Url：

1         @JavascriptInterface
2         public void excuteHtmlFun(){
3             runOnUiThread(new Runnable() {
4                 @Override
5                 public void run() {
6                     mWvShow.loadUrl("javascript: showFromHtml('我很好！')");//调用js内的showFromHtml（param）方法
7                 }
8             });
9         }

js的showFromHtml(param)方法：

   function showFromHtml( param ){document.getElementById("id_input").value = "Java call Html : " + param;}

button内直接调用java类中的方法

1 <input type="button" style="height: 40px " value="excuteHtmlFun" οnclick="window.jsObj.excuteHtmlFun()"/>

出现效果就是点击按钮调用java的方法，java方法中使用了js的方法，显示在网页上。

转载于:https://www.cnblogs.com/lwandxcq/p/5668038.html

安卓与HTML简单的交互使用相关推荐

Python基础之简单用户交互
Python基础之简单用户交互一.要求及目的二.代码内容三.学习总结一.要求及目的要求设计一个简单的计算程序二.代码内容 # 简单计算 a = input("please inp ...
《交互式程序设计第2版》一3.5 捕获简单用户交互行为
本节书摘来华章计算机<交互式程序设计第2版>一书中的第3章 ,第3.5节,Joshua Noble 著毛顺兵张婷婷陈宇沈鑫任灿江译更多章节内容可以访问云栖社区"华章 ...
注释和简单用户交互程序
一.注释 Python的注释很简单,有两种方法: 1. #这是注释改方法会注释掉该行"#"号后面的所有内容,注释掉的内容不会被运行 2. 1 '''这是注释 2 这是注释 3 这 ...
安卓Android与H5双向交互MathJax展示数学公式(源码+解析)
安卓Android与H5双向交互MathJax展示数学公式(源码+解析) 博主就今天周五又做了个需求(安卓Android与H5交互),原来上线的功能是服务器配置过来的学习报告(一个H5页面)并提供原始 ...
Scratch入门教程：第二节简单的交互
Scratch入门教程第二节简单的交互文章目录 Scratch入门教程一.人机交互二.控制角色运动方向三.角色的旋转方式欢迎订阅 cratch入门教程:简单的交互. 一.人机交互人机交 ...
安卓和后端服务器数据交互
记录一下安卓和后端数据交互吧!数据传输框架OkHttp3 题外话::其实安卓和后端的数据交互也就相当于网页端和后端的交互一样.后端一样的写接口!传数据的变成了安卓端而已!由于公司要求都是写全套的,所以 ...
利用VRML设计简单的交互三维室内漫游场景
利用VRML设计简单的三维室内漫游场景利用3dmaxs建模 VRMLPad里编辑代码利用3dmaxs建模首先,利用3dmaxs或其他的建模工具建模.这里建的模很简单,因为小文件方便调试,示例中的 ...
攻防世界 mobile 安卓移动端简单题练习区答题（1-12题解）
序 1.easyjni 题目描述:无题目思路: 获得一个apk,网易mumu模拟器安装打开. 丢到JEB里面,先看一下配置文件找标签name属性,看看主函数. 进主函数,解析一下看源代码.找到点 ...
Android（安卓）一个简单的聊天界面的实现（eclipse实现）
这几天刚刚学习一下安卓的编程,尝试制作了一个简单的聊天界面(还没有实现网络等后续功能)软件界面如图.(使用eclipse实现) 当输入一些内容后,聊天界面可以下拉显示更多的聊天信息,如下图首先对这个 ...

安卓与HTML简单的交互使用

安卓与HTML简单的交互使用相关推荐

最新文章

热门文章