1. 简介
cordova-plugin-hellonative 是一个 Cordova 插件，它可以让你在 Cordova 项目中调用原生代码。使用该插件可以方便地将 Cordova 的 Web App 和原生应用结合起来，让应用享受到更广泛的原生功能支持。本文将介绍如何使用 cordova-plugin-hellonative 并提供实用的示例代码。
2. 安装
首先，安装 Cordova 工具：
npm install -g cordova
然后，创建名为 myApp 的新 Cordova 应用：
cordova create myApp cd myApp
在 myApp 中添加 cordova-plugin-hellonative：
cordova plugin add cordova-plugin-hellonative
3. 使用
3.1 调用原生代码
可以通过以下方式在 JavaScript 中调用原生代码：
cordova.exec(successCallback, errorCallback, "HelloNative", "action", [args]);
其中，successCallback 和 errorCallback 分别是成功和失败回调函数，"HelloNative" 是你的原生代码名称，"action" 是你的代码执行的操作名称，args 是你要传递给代码的参数。
举个例子：
cordova.exec(function (result) {
console.log('Success: ' + result);
}, function (error) {
console.log('Error: ' + error);
}, "HelloNative", "hello", []);这样就会调用 hello 方法（也就是原生代码中的 hello 方法）。
3.2 编写原生代码
在 Cordova 项目中创建原生插件：
cordova plugin create myplugin com.example.myplugin "My Plugin"
创建插件的命令会生成 myplugin 目录，其中包含了各种文件和文件夹，包括 Android 和 iOS 的相关代码。
重点是在 src 目录下，创建一个 MyPlugin.java（Android）或 MyPlugin.m（iOS）文件来编写原生代码。举个例子，下面的 Java 代码展示了如何编写一个返回字符串的方法：
-- -------------------- ---- -------
------- ---------------------
------ ---------------------
------ -------------------
------ -----------------------
------ ----- -------- ------- ------------- -
---------
------ ------- -------------- ------- --------- ----- --------------- ---------------- ------ ------------- -
-- ------------------------ -
------ ------- - ------- --------
---------------------------------
------ -----
-
------ ------
-
-在这个例子中，当调用 hello 方法时，execute 方法会被调用。execute 方法将 "Hello, world!" 字符串作为消息返回给 JavaScript 回调函数。
3.3 添加 Android 平台配置
将平台添加到 Cordova 应用程序中：
cordova platform add android
为了确保在构建时引入插件，请打开 platforms/android/app/src/main/res/xml/config.xml 文件并添加以下行：
<plugin name="com.example.myplugin" value="com.example.myplugin.MyPlugin"/>
你现在可以构建 Android 应用程序：
cordova build android
3.4 添加 iOS 平台配置
在 Cordova 应用程序中添加 iOS 平台：
cordova platform add ios
为了确保在构建时引入插件，请打开 platforms/ios/myApp/MyApp.xcodeproj 项目，并导航到 General > Linked Frameworks and Libraries。单击 + 添加新框架并选择 libMyPlugin.a。
你现在可以构建 iOS 应用程序：
cordova build ios
4. 示例代码
最后，下面提供一个完整的示例代码，它定义了两个方法：hello 和 goodbye。
-- -------------------- ---- ------- --- ---- - ------------------------ ------------- - ----------------- ------ - ------------- ------ -------------- -------- ---- -- --------------- - ----------------- ------ - ------------- ------ -------------- ---------- ---- --
-- -------------------- ---- -------
------- ---------------------
------ ---------------------
------ -------------------
------ -----------------------
------ ----- -------- ------- ------------- -
---------
------ ------- -------------- ------- --------- ----- --------------- ---------------- ------ ------------- -
-- ------------------------ -
------ ------- - ------- --------
---------------------------------
------ -----
- ---- -- -------------------------- -
------ ------- - --------- --------
---------------------------------
------ -----
-
------ ------
-
-这个例子中，JavaScript 代码调用 hello 方法，Java 代码将消息 "Hello, world!" 作为参数返回给 JavaScript 回调函数，同理，当调用 goodbye 方法时，Java 代码将消息 "Goodbye, world!" 作为参数返回给 JavaScript 回调函数。
5. 结语
通过使用 cordova-plugin-hellonative 插件可以方便地将 Cordova 的 Web App 和原生应用结合起来。使用它，您可以访问原生代码提供的功能，从而为您的应用程序带来更加丰富的功能和交互体验。希望这篇文章对您的学习和开发有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005530b81e8991b448d06ab