一、前言
现在市面上有一些app是通过原生ios、Android加载一个网页实现的,如图所示,这样的app我们称之为 Hybrid App
那么为什么要用 hybrid app呢? 个人认为的原因有两点:
1.提高开发效率,以钉钉为例在涉及到一些OA操作比如打卡,请假等功能的时候,显然一个嵌入一个网页就能够满足需求,如果在让IOS和Android再去各自开发一套那么效率就很低了。
2.提高迭代效率。以商城为例,商城页面会根据市场情况实时发生变化,比如遇到各种节假日活动做促销。那么这个时候如果用原生,那么迭代等用户去升级可能这个活动都已经过了,但是用嵌套webview嵌套一个网页只需要网页做出修改hybrid app内的web页面就会马上修改,这样效率就非常高了。
hybrid app 实际上就是利用原生的组件webview加载一个url再让js和原生相互调用实现各种功能,那么接下来我就把js和原生相互调用的情况做一个总结。
二、原生api实现:js和原生相互调用
要想让js和原生相互调用,对于webview最基本的一个设置就是要允许js脚本执行
WebSettings settings = mWebView.getSettings();
settings.setJavaScriptEnabled(true);
(一)、js调用原生
假设我现在有一个需求:点击web中的一个按钮,将web中的值传递给原生并在TextView组件中显示出来。那么这个需求怎么实现呢?
第一步:在java代码中定义js要调用的方法
// 定义JS需要调用的方法 // 被JS调用的方法必须加入@JavascriptInterface注解 @JavascriptInterface public void sendMsg(String msg) {// Log.i(TAG, "JS调用了Android的hello方法" + msg);// Toast.makeText(mContext, "JS调用了Android的hello方法" + msg, Toast.LENGTH_SHORT).show(); //为了方便拿到上下文和ui组件,写一