android phonegap插件開發方法 plugin

時間 2019-11-05

標籤 android phonegap 插件開發方法 plugin 欄目 Android 简体版

原文原文鏈接

android phonegap插件開發方法 plugin

分類： phonegap 2014-03-03 22:41 5951人閱讀評論(2) 收藏舉報

android phonegap 插件 plugins cordova

此篇文章以cordova 3.4版本編寫 javascript

phonegap的插件開發與javascript調用android的Activity功能,以及相互傳遞數據. html

本節講的是自主編寫 phonegap插件提供下載 java

據我總結核心步驟: 建立工程 ; 編寫插件 ;編譯工程; 調用插件; android

按照以下步驟就能生產出代碼: apache

打開cmd 控制檯 json

1 使用命令行創建phonegap工程 app

2 將工程導入 eclipse eclipse

3 在assents 目錄下的 cordova-plugins.js文件添加配置 ui

4 在plugin目錄下編寫javascript接口 google

5 在res/xml 目錄下配置 config.xml 文件

6 在src目錄下編寫java文件

最後在javascript文件中調用接口

整體說主要是後4個步驟詳細分解講解

接下來給你們分解演示:

目測你們都是已經安裝好環境的,若是沒有搭好環境能夠查看個人phonegap配置文章點擊打開連接

調用系統的API 官方文檔地址點擊打開連接

<1> 在控制檯建立一個phonegap工程命令以下

[java] view plain copy

phonegap create my-app
cd my-app
phonegap run android

<2> 將工程導入 eclipse

<3> 配置 cordova _plugins.js 文件

首先給你們看看cordova _plugins.js 文件:

[javascript] view plain copy

cordova.define('cordova/plugin_list', function(require, exports, module) {
module.exports = [
{
"file": "plugins/org.apache.cordova.camera/www/CameraConstants.js",
"id": "org.apache.cordova.camera.Camera",
"clobbers": [
"Camera"
]
},
{
"file": "plugins/org.apache.cordova.camera/www/CameraPopoverOptions.js",
"id": "org.apache.cordova.camera.CameraPopoverOptions",
"clobbers": [
"CameraPopoverOptions"
]
},
{
"file": "plugins/org.apache.cordova.camera/www/Camera.js",
"id": "org.apache.cordova.camera.camera",
"clobbers": [
"navigator.camera"
]
},
{
"file": "plugins/org.apache.cordova.camera/www/CameraPopoverHandle.js",
"id": "org.apache.cordova.camera.CameraPopoverHandle",
"clobbers": [
"CameraPopoverHandle"
]
},
{
"file": "plugins/org.apache.cordova.dialogs/www/notification.js",
"id": "org.apache.cordova.dialogs.notification",
"merges": [
"navigator.notification"
]
},
{
"file": "plugins/org.apache.cordova.dialogs/www/android/notification.js",
"id": "org.apache.cordova.dialogs.notification_android",
"merges": [
"navigator.notification"
]
},
{
"file": "plugins/org.apache.cordova.vibration/www/vibration.js",
"id": "org.apache.cordova.vibration.notification",
"merges": [
"navigator.notification"
]
},
{
"file": "plugins/intent.js",
"id": "org.apache.cordova.intent",
"merges": [
"navigator.intent"
]
},
];
module.exports.metadata =
// TOP OF METADATA
{
"org.apache.cordova.camera": "0.2.7",
"org.apache.cordova.dialogs": "0.2.6",
"org.apache.cordova.vibration": "0.3.7",
"org.apache.cordova.intent" :"0.0.1",
}
// BOTTOM OF METADATA
});

我以前配置了camera ,dialog , vibration ,你們能夠參考

如今來分解 ,這裏要配置2個地方

module.exports= [{}];

module.exports.metadata = { }

在module.exports 的花括號裏面配置

[javascript] view plain copy

{
"file": "plugins/intent.js",
"id": "org.apache.cordova.intent",
"merges": [
"navigator.intent"
]
},

file 表明 javascript寫的接口位置

id 表明惟一

merges 表明你在 javascript中調用該接口的語句 (相似activity中的 getApplication() 等等 ;就是個調用語句)

在module.exports.metadata 中配置id

標號隨意

<4> 在plugin目錄下編寫javascript接口

貼上intent.js的接口代碼

[javascript] view plain copy

cordova.define("org.apache.cordova.intent", function(require, exports, module) {
var exec = require('cordova/exec');
module.exports = {
/**
* 一共5個參數
第一個 :成功會掉
第二個 :失敗回調
第三個 :將要調用的類的配置名字(在config.xml中配置稍後在下面會講解)
第四個 :調用的方法名(一個類裏可能有多個方法靠這個參數區分)
第五個 :傳遞的參數以json的格式
*/
demo: function(mills) {
exec(function(winParam){
alert(winParam);
}, null, "Demo", "intent", [mills]);
},
};
});

Demo中成功返回會彈出一個Alert();

在javascript中的調用語句是

[javascript] view plain copy

navigator.intent.demo(1);

貼上整的javascript

[javascript] view plain copy

<!DOCTYPE html>
<html>
<head>
<title>Notification Example</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for device API libraries to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// device APIs are available
//
function onDeviceReady() {
// Empty
}
// Show a custom alert
// native的 Dialog 對話框
function showAlert() { navigator.notification.alert( 'You are the winner!', // message
'Game Over',
// title
'Done'
// buttonName
); }
// Beep three times
// 響鈴3聲
function playBeep() { navigator.notification.beep(3); }
// Vibrate for 2 seconds
// 振動
function vibrate() { navigator.notification.vibrate(100000); }
// 跳轉
function intent() { navigator.intent.demo(1); }
</script>
</head>
<body>
<p><a href="#" onclick="showAlert(); return false;">Show Alert</a></p>
<p><a href="#" onclick="playBeep(); return false;">Play Beep</a></p>
<p><a href="#" onclick="vibrate(); return false;">Vibrate</a></p>
<p><a href="#" onclick="intent(); return false;">Html跳轉到android界面</a></p>
</body>
</html>