More Related Content
Similar to PhoneGap勉強会 in 熊本
Similar to PhoneGap勉強会 in 熊本 (20)
PhoneGap勉強会 in 熊本
- 14. iOS/Android
$ cd lib/ios/bin
$ cd lib/android/bin
$ ./create PROJECT_LOCATION
PACKAGE_NAME PROJECT_NAME
例
$ ./create /Documents/FirstProject
com.example.FirstProject
FirstProject
- 21. index.html
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1,
maximum-scale=1, minimum-scale=1, width=device-width, height=device-
height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<title>Hello World</title>
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
</div>
</div>
<script type="text/javascript" src="cordova-2.7.0.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
</html>
- 22. index.js
var app = {
initialize: function() {
this.bindEvents();
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
app.receivedEvent('deviceready');
},
receivedEvent: function(id) {
var parentElement = document.getElementById(id);
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
console.log('Received Event: ' + id);
}
};
- 24. 共通API
• Accelerometer
• Camera
• Capture
• Compass
• Connection
• Contacts
• Device
• Events
• File
http://phonegap.com/about/feature/
• Geolocation
• Globalization
• InAppBrowser
• Media
• Notification
• Splashscreen
• Storage