Enviroments
% npm version
{ http_parser: '1.0',
node: '0.10.18',
v8: '3.14.5.9',
ares: '1.9.0-DEV',
uv: '0.10.15',
zlib: '1.2.3',
modules: '11',
openssl: '1.0.1e',
npm: '1.3.8' }
% phonegap -v
3.0.0-0.14.3
Prepare
create skelton.
% phonegap create hello com.example.hello HelloWorld % cd hello % phonegap local build android
install application into android device.
% adb install bin/HelloWorld-debug.apk
and run it.
Add touchable button for testing
Edit: hello/test/index.html
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, heig
<link rel="stylesheet" type="text/css" href="css/index.css" />
<title>Hello World</title>
+ <style>
+.btn {
+ border-radius:4px;
+ -webkit-border-radius:4px;
+ color:#FFFFFF;
+ font-size:12px;
+ margin:15px 30px 0;
+ padding:4px 0px;
+ background-color:#333333;
+ display:block;
+}
+ </style>
</head>
<body>
<div class="app">
@@ -31,6 +43,7 @@
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
+ <p id="hello" class="btn">Hello</p>
</div>
</div>
<script type="text/javascript" src="phonegap.js"></script>
Edit: www/js/index.js
// function, we must explicity call 'app.receivedEvent(...);'
onDeviceReady: function() {
app.receivedEvent('deviceready');
+
+ var helloButton = document.getElementById('hello');
+
+ helloButton.addEventListener("touchstart", function touchHandler(e) {
+ console.log("touched helloButton");
+ e.preventDefault();
+ }, false);
+
},
// Update DOM on a Received Event
receivedEvent: function(id) {
build this.
% phonegap local build android
install again.
% cd hello/platforms/android % adb install -r bin/HelloWorld-debug.apk
Run it. And check console.log
% adb logcat | grep Console
Create Echo plugin
Edit: platforms/android/res/xml/config.xml
<feature name="App">
<param name="android-package" value="org.apache.cordova.App" />
</feature>
+ <feature name="Echo">
+ <param name="android-package" value="com.example.hello.plugin.Echo" />
+ </feature>
<access origin="http://127.0.0.1*" />
<preference name="useBrowserHistory" value="true" />
<preference name="exit-on-suspend" value="false" />
Create: src/com/example/hello/plugin/Echo.java
package com.example.hello.plugin;
import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CallbackContext;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
/**
* This class echoes a string called from JavaScript.
*/
public class Echo extends CordovaPlugin {
@Override
public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
if (action.equals("echo")) {
String message = args.getString(0);
this.echo(message, callbackContext);
return true;
}
return false;
}
private void echo(String message, CallbackContext callbackContext) {
if (message != null && message.length() > 0) {
callbackContext.success(message);
} else {
callbackContext.error("Expected one non-empty string argument.");
}
}
}
Edit: www/index.html
onDeviceReady: function() {
app.receivedEvent('deviceready');
+ var success = function(result) {
+ console.log('success');
+ console.log(result);
+ }
+ var failure = function(err) {
+ console.log('failure');
+ console.log(err);
+ }
+
var helloButton = document.getElementById('hello');
helloButton.addEventListener("touchstart", function touchHandler(e) {
console.log("touched helloButton");
e.preventDefault();
+ cordova.exec(success, failure, "Echo", "echo", ["World!!"]);
+
}, false);
},
Edit: www/js/index.js
onDeviceReady: function() {
app.receivedEvent('deviceready');
+ var success = function(result) {
+ console.log('success');
+ console.log(result);
+ }
+ var failure = function(err) {
+ console.log('failure');
+ console.log(err);
+ }
+
var helloButton = document.getElementById('hello');
helloButton.addEventListener("touchstart", function touchHandler(e) {
console.log("touched helloButton");
e.preventDefault();
+ cordova.exec(success, failure, "Echo", "echo", ["World!!"]);
+
}, false);
},
build & install
% ant debug % adb install -r bin/HelloWorld-debug.apk
Thank you.