上篇文章中讲述了Android原生怎么集成MUI框架的，这篇文章接上篇文章
来继续讲解在Android集成了MUI(或者H5)后进行原生与H5之间的通讯功能，从而实现其交互功能（项目Demo如下，有需要的可以下载查看）：
1在mui中新建通讯类插件nativeManager.js，代码如下：
/**
* 原生平台操作管理器
*/
var nativeManager = {
/**
* 原生平台管理器
*/
manager: {
/**
* iOS平台
*/
iOS: {
/**
* 通知管理中心
*/
get notificationCenter() {
return plus.ios.importClass("NSNotificationCenter").defaultCenter()
}
},
/**
* Android平台
*/
android: {
/**
* 通知管理中心
*/
get notificationCenter() {
return plus.android.importClass("com.example.andyyuan.androidmui.OpenActivityUtils")
},
/**
* 通信类名称
*/
communicationClassName: "com.example.andyyuan.androidmui.OpenActivityUtils",
/**
* 通信类名称+回调
*/
communicationClassNameCallBack: "com.example.andyyuan.androidmui.OpenActivityUtils$CallBack",
/**
* 通信类标准方法
*/
communicationDefaultFunctionName: "loadDataFromH5ToNative",
/**
* 通信类回调标准方法
*/
callBackDefaultFunctionName: "loadDataFromNativeToH5",
/**
* 通信类回调标准方法
*/
callBackEvent: function (callBack) {
var _self = nativeManager.manager.android
var callBackDefaultFunctionName = _self.callBackDefaultFunctionName
var communicationClassNameCallBack = _self.communicationClassNameCallBack
return plus.android.implements("com.example.andyyuan.androidmui.OpenActivityUtils$CallBack", {
"loadDataFromNativeToH5" : function(jsonObject){
callBack(jsonObject)
}
})
},
/**
* h5发送消息给原生
* @param {
* platform， 平台类型：Android
* methodType，方法类型：nativeManager.manager.methodType
* jsonObject, json数据对象
* } jsonObject
* @param {Object} callBack
*/
post: function (jsonObject, callBack) {
try{
if (plus) {
var _self = nativeManager.manager.android
plus.android.invoke(_self.communicationClassName, _self.communicationDefaultFunctionName, JSON.stringify(jsonObject), _self.callBackEvent(callBack))
} else {
console.log("H5与原生交互失败，请在原生项目中运行")
}
}catch(e){
console.log("H5与原生交互失败，请在确定在原生项目中运行 error: "+e)
}
}
},
methodType: {
/**
* 一般发送方法
*/
normal: "normal",
/**
* 发送在线用户数据
*/
appUser: "appUser",
/**
* 发送打开网格走访模块的指令
*/
openNativePatrol: "openNativePatrol",
}
},
keys: {
loadDataFromH5ToNative: "loadDataFromH5ToNative"
},
/**
* 发送消息至原生APP
* @param {
* platform， 平台类型：iOS、Android
* methodType，方法类型：nativeManager.manager.methodType
* jsonObject, json数据对象
* } jsonObject
* @param {function(jsonObject)} callBack
*/
postMessage: function(jsonObject, callBack){
var baseJsonObject = this.checkJSONObject(jsonObject)
if (baseJsonObject.methodType == undefined || baseJsonObject.methodType == null) {
baseJsonObject.methodType = this.manager.methodType.normal
}
if (mui.os.ios) {
baseJsonObject.platform = "iOS"
nativeManager.postMessageToIOS(baseJsonObject, callBack)
} else {
jsonObject.platform = "Android"
nativeManager.postMessageToAndroid(baseJsonObject, callBack)
}
console.log("h5发送消息给原生APP："+JSON.stringify(baseJsonObject))
},
/**
* 向苹果原生APP发送数据
* @param {
* platform， 平台类型：iOS
* methodType，方法类型：nativeManager.manager.methodType
* jsonObject, json数据对象
* } jsonObject
* @param {function(jsonObject)} callBack
*/
postMessageToIOS: function(jsonObject, callBack){
try{
var manager = this.manager.iOS.notificationCenter
if (manager) {
manager.postNotificationNameobject(this.keys.loadDataFromH5ToNative, JSON.stringify(jsonObject))
} else {
console.log("H5与原生交互失败，请在原生项目中运行")
}
}catch(e){
console.log("H5与原生交互失败，请在确定在原生项目中运行 error: "+e)
}
},
/**
* 向安卓原生APP发送数据
* @param {
* platform， 平台类型：Android
* methodType，方法类型：nativeManager.manager.methodType
* jsonObject, json数据对象
* } jsonObject
* @param {function(jsonObject)} callBack
*/
postMessageToAndroid: function(jsonObject, callBack){
this.manager.android.post(jsonObject, callBack)
},
/**
* 向原生APP发送在线用户数据
* @param {登录接口返回的JSON数据对象} jsonObject
*/
postAppUserMessage: function(jsonObject){
var baseJsonObject = {
"methodType" : this.manager.methodType.appUser
}
baseJsonObject.jsonObject = {
"identity": jsonObject.user.id,
"roleId": jsonObject.user.roleid,
"deptId": jsonObject.user.deptid,
"account": jsonObject.user.account,
"password": jsonObject.user.password,
"name": jsonObject.user.name,
"avatarUrl": jsonObject.user.createtime,
"createtime": jsonObject.user.account,
"email": jsonObject.user.email,
"phone": jsonObject.user.phone,
"salt": jsonObject.user.salt,
"sex": jsonObject.user.sex,
"version": jsonObject.user.version,
"status": jsonObject.user.status,
"token": jsonObject.token,
"baseUrl": common.constant.baseUrl,
"uploadFileUrl": common.constant.uploadUrl
}
this.postMessage(baseJsonObject)
},
/**
* 向原生APP发送打开原生模块的指令消息
*/
postOpenGridPatrolMessage: function(jsonObject){
var baseJsonObject = {
"methodType" : this.manager.methodType.openGridPatrol
}
baseJsonObject.jsonObject = {
"identity": jsonObject.name,
"token": jsonObject.age
}
this.postMessage(baseJsonObject)
},
/**
* 校验JSON对象
* @param {JSON对象} jsonObject
*/
checkJSONObject: function(jsonObject){
if (jsonObject == undefined || jsonObject == null) {
return {}
}
return jsonObject
},
}2：在H5或者mui框架中的js文件中调用如下：
调用方式为如下：
参数如下：
1：jsonObject是需要从H5界面传入到原生中的，即调用框架使用的。
2：postOpenNativePatrolMessage()方法为H5插件的发送消息给原生的。
//在关于界面测试与原生交互
var jsonObject = {
"name": "andyYuan",
"age": "23"
};
nativeManager.postOpenNativePatrolMessage(jsonObject) //打开原生模块指令。3：原生中接收H5的消息并给与回调
原生中写一个工具类我们取名为OpenActivityUtils.java文件（这个文件一定要和NativeManager.js文件中反射调用的名称一致），用来接收js中发送过来的指令和我们做出回调callback。
在mui框架中写好通向原生的插件后，在原生中需要接收H5中发送过来的消息文件，然后做出应答，这里我们新建Java文件接收消息的工具为OpenActivityUtils.java文件，文件信息代码如下（之后写打开某个界面按照这个标准模式来写，其中的传递参数一定要和js中的参数保持一致性）：
参数如下：
1：OpenActivityUtils是当前应用中原生接收H5发送过来的代码工具类，由H5调用。
2：jsonObject参数是H5插件传递过来的携带数据。
3：CallBack参数原生需要回调给H5的结果数据。
其中该文件如下：
/**
* Created by AndyYuan on 2019/11/06.
* 描述: TODO 接收接收中发送过来的数据并在原生中调用原生中的页面逻辑等以及回调给H5中
*/
public class OpenActivityUtils {
private static Context mContext;
private static String mToken = "";
private static String mUserId = "";
public static String mBaseUrl = "";
private static Activity mActivity;
private static String lngAndLat;
private static Intent intent;
/**
* 请求权限的回调
*/
public interface CallBack {
void loadDataFromNativeToH5(String lngAndLat);
}
private static int GPS_REQUEST_CODE = 10;
/**
* 初始化工具类 * @param context
*/
public static void initUtils(Context context) {
mContext = context.getApplicationContext();
}
public static void setActivity(Activity activity) {
mActivity = activity;
}
/**
* 从H5中接收数据和方法回调
*
* @param jsonObject
* @param callBack
*/
public static void loadDataFromH5ToNative(String jsonObject, CallBack callBack) {
try {
//接收H5传递过来的json数据
Log.d(TAG, "openActivitUtils: " + jsonObject);
JSONObject jsonObj = new JSONObject(jsonObject);
String methodType = jsonObj.getString("methodType");
Log.e(TAG,"获取的H5传来的"+jsonObj.getString("jsonObject"));
JSONObject JsonBean = null;
switch (methodType) {
//我们根据H5传递过来的方法类型进行不同的判断操作
case "openNativePatrol":
JsonBean = new JSONObject(jsonObj.getString("jsonObject"));
String name=JsonBean.getString("identity");
String age = JsonBean.getString("token");
Log.d(TAG, "openActivitUtils:===JsonBean= " + JsonBean);
Intent intent = null;
Log.d(TAG, "loadDataFromH5ToNative: " + name);
Log.d(TAG, "loadDataFromH5ToNative: " + age);
//z这里打开测试界面，用户可以在这里打开想要打开的页面或者业务逻辑
intent = new Intent(MyApplication.getInstance(), MainActivity.class);
intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
//MyApplication是我们应用中自己定义的Application类
MyApplication.getInstance().startActivity(intent);
break;
case "openLocationAddress":
Intent intents = null;
String title = jsonObj.getString("title");
break;
case "loadGPSInfo":
break;
default:
break;
}
} catch (JSONException e) {
e.printStackTrace();
Log.e(TAG, "error==" + e.getMessage());
}
}
}4：OK插件开发完成我们就可以根据不同的业务需求来进行我们自己项目中的开发工作了。
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
