注：在做例子之前要先做好准备工作，在app下新建一个名为：assets的目录（不懂怎么创建的可参考：https://blog.csdn.net/Biegral/article/details/47170037）

assets目录下存放要加载的HTML文件等

有关webView的讲解自行百度，这里直接用例子来大概了解一下：

Xml布局文件：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical">

    <WebView

        android:id="@+id/obd_webview"

        android:layout_width="match_parent"

        android:layout_height="0dp"

        android:layout_weight=""/>

    <TextView android:id="@+id/obd_text"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:text=""/>

</LinearLayout>

HTML内容：

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html;charset=utf-8">

        <script type="text/javascript">

            function actionFromNative(){

                 document.getElementById("log_msg").innerHTML +=

                     "<br\>Native调用了js函数";

            }

            function actionFromNativeWithParam(arg){

                 document.getElementById("log_msg").innerHTML +=

                     ("<br\>Native调用了js函数并传递参数："+arg);

            }

        </script>

    </head>

    <body>

        <p>WebView与Javascript交互</p>

        <div>

            <button onClick="window.web.actionFromJs()">点击调用Native代码</button>

        </div>

        <br/>

        <div>

            <button onClick="window.web.actionFromJsWithParam('come from Js')">点击调用Native代码并传递参数</button>

        </div>

        <br/>

        <div id="log_msg">调用打印信息</div>

    </body>

</html>

Android中的逻辑处理：

public class OBDCheckWebView extends AppCompatActivity {

    private WebView OBDmwebView;

    private TextView OBDTextView;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_obdcheck_webview);

        OBDmwebView = this.findViewById(R.id.obd_webview);

        OBDmwebView.getSettings().setJavaScriptEnabled(true);   //启用Javascript

        OBDmwebView.loadUrl("file:///android_asset/web.html");  //加载文件的路径以及文件名

        OBDmwebView.addJavascriptInterface(this,"web");

        OBDTextView = this.findViewById(R.id.obd_text);

        String [] data = {"","fs301","","粤-A888","白色","2019-02-02 15:38:28","338km"};

    }

    //此方法没参数

    @android.webkit.JavascriptInterface

    public void actionFromJs() {

        runOnUiThread(new Runnable() {

            @Override

            public void run() {

                Toast.makeText(OBDCheckWebView.this, "js调用了Native函数", Toast.LENGTH_SHORT).show();

                String text = OBDTextView.getText() + "\njs调用了Native函数";

                OBDTextView.setText(text);

            }

        });

    }

    //可传递参数

    @android.webkit.JavascriptInterface

    public void actionFromJsWithParam(final String[] str) {

        runOnUiThread(new Runnable() {

            @Override

            public void run() {

                Toast.makeText(OBDCheckWebView.this, "js调用了Native函数传递参数：" + str, Toast.LENGTH_SHORT).show();

                String text = OBDTextView.getText() +  "\njs调用了Native函数传递参数：" + str;

                OBDTextView.setText(text);

            }

        });

    }

}

运行效果如图：

Android-----WebView加载HTML界面布局并进行数据交互的更多相关文章

  1. 移动web、webApp、混合APP、原生APP、androd H5混合开发 当无网络下，android怎么加载H5界面

    PhoneGap是一个采用HTML,CSS和JavaScript的技术,创建移动跨平台移动应用程序的快速开发平台.它使开发者能够在网页中调用IOS,Android,Palm,Symbian,WP7,W ...

  2. Android WebView加载本地html并实现Java与JS交互

    最近做的一个项目中,用到自定义地图,将自定义地图转换成html页面,现在需要做的是如何将本地的html加载到android中,并可以实现交互. 相关讲解: 其实webview加载资源的速度并不慢,但是 ...

  3. Andriod中WebView加载登录界面获取Cookie信息并同步保存,使第二次不用登录也可查看个人信息。

    Android使用WebView加载登录的html界面,则通过登录成功获取Cookie并同步,可以是下一次不用登录也可以查看到个人信息,注:如果初始化加载登录,可通过缓存Cookie信息来验证是否要加 ...

  4. 转:Android Webview 加载外部html时选择加载本地的js,css等资源文件

    原文地址:http://m.blog.csdn.net/blog/qduningning/43196819 在使用WebView加载网页的时候,有一些固定的资源文件如js的jquery包,css,图片 ...

  5. Android WebView 加载富文本内容

    WebView加载数据的方式有两种: 1. webView.loadUrl(data);//加载url 2. webView.loadDataWithBaseURL(null,data, " ...

  6. Android WebView 加载超长 JS 数据

    在之前的文章里面,我总结过WebView如何与网页交互,也就是Java如何和JS交互 —— Android WebView 总结 —— Java和JavaScript交互. 基于这篇文章,我们基本上能 ...

  7. android webview 加载本地html 实现 与 java 之间的相互响应

    1.布局 <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:androi ...

  8. Android WebView 加载网页

    通过Android 中 WebView 控件加载HTML5 页面,这是实现Android 混合开发的基础. 选择加载的网页可以是本地,也可用使远程的.需要添加访问互联网的权限:<uses-per ...

  9. android webview加载网络连接

    webview = (WebView) findViewById(R.id.webview); WebSettings webSettings = webview.getSettings(); //设 ...

随机推荐

  1. ajax中什么时候进success和error

    先简单介绍下ajax: 简单的说Ajax请求通过XMLHttpRequest对象发送请求,该对象有四个状态(readyState): -未初始化.-正在初始化.-发送数据.-正在发送数据.-完成. 当 ...

  2. CF1081C-Colorful Bricks-(dp||组合数)

    http://codeforces.com/problemset/problem/1081/C 题意:有n个排成一行板块,有m种颜色,要让这些板块有k对相邻板块不同颜色,有多少种涂色方法? 比如样例2 ...

  3. q1096

    一,看题 1,大概是每个点都来一次BFS标记下应该就可以. 2,你可以想想队列为啥pop()是l++; 3,还是字符你得注意下. 4,x,y,m,n,行列你得搞清楚. 5,这棋盘的破东西.. 6,额, ...

  4. Console工程下如何不显示控制台黑窗口只显示Windows窗口

    原文地址https://www.cnblogs.com/smiler/p/4575052.html OpenGL,绘制图形的时候,如果不进行设置,运行的时候会先出现黑窗口再出现Windows窗口. 其 ...

  5. Python——IO多路复用之select模块select方法

    Python——IO多路复用之select模块select方法 使用select模块的select方法实现Python——IO多路复用 实现同时将终端输入的文本以及客户端传输的文本写入文本文件中: w ...

  6. 2018-2019-2 20165315《网络对抗技术》Exp9 Web安全基础

    2018-2019-2 20165315<网络对抗技术>Exp9 Web安全基础 目录 一.实验内容 二.实验步骤 1.Webgoat前期准备 2.SQL注入攻击 Command Inje ...

  7. [BUAA软工]gamma阶段贡献分

    Gamma阶段评分 基本公式:贡献度 = 工作量 × 工作的影响力 × 工作的不可替代性 + 对项目有重大意义的idea gamma阶段所有的工作及idea issue/idea/job (repo: ...

  8. Apache Beam实战指南 | 大数据管道（pipeline）设计及实践

    Apache Beam实战指南 | 大数据管道(pipeline)设计及实践  mp.weixin.qq.com 策划 & 审校 | Natalie作者 | 张海涛编辑 | LindaAI 前 ...

  9. k8s之发布管理架构图01

    k8s发布管理所用到的组件

  10. 01.普通抖音新手如何从0开始入门3个月做到粉丝100w+

    普通抖音新手如何从0开始入门3个月做到粉丝100w+ 今年以来,明显感觉抖音很火,大有干掉微信,取代淘宝,京东的感觉,如今年轻人,一周7天有7天要玩抖音,所以说未来不可估量. 如是,2019春节以后, ...