So you want to Develop on Android....

So You Want to Develop
on Android...
Timothy Lim @thewheat
thewheatfield.org /cornergeeks.com
Downloads:
http://tiny.cc/googleiobn
http://db.tt/kS08Pb6s

Overview
● apk = exe / dmg / tar.gz
○ We're pirates!
○ Portable & Transferable
●
●
●
● Permissions
○ Don't freak out the user
○ AndroidManifest.xml

Overview
HC/ICS emulators scare me
○ Get an Android device & download USB drivers now
http://developer.android.com/tools/extras/oem-usb.html
●
● So many pixels
○ so many platforms
○ so little time
■ Android 2.2
■ HVGA (480x320)
●

Get the Tools!
● SDK http://developers.android.com
○ tools to transfer apk to device
○ different Android platforms (1.x,2.x,...) & emulator
●
● Eclipse http://eclipse.org
○ Android Development Tools
(ADT) plugin
●
● PhoneGap http://phonegap.com
○ Mobile cross development platform
○ i.e. we don't need no Java! (ok maybe a little)
●

● HTML & Javascript based
○ Easy & Familiar (if not get familiar)
○ Exposes device features via Javascript objects
●
● Quick design & prototyping
○ all in the browser
●
● Cross platform
●
● Translatable skills
●
●
Why PhoneGap?

PhoneGap Sample - Starting Up
assets/www/index.html
Start something when app is loaded
●
<body onload="onLoad()">
-------------------------------------------------------
function onLoad() {
document.addEventListener("deviceready",
onDeviceReady, false);
}
function onDeviceReady(){
initializeMapICentre();
}
●

PhoneGap Sample - Interactivity
<a href="#" onclick="mediaPlay()" id="lnk_play">
<img id="play" src="images/play.png">
</a>
-------------------------------------------------------
function mediaPlay() {
if (!mediaPlaying) {
...
myAudio = new Media(URL_STREAM); myAudio.play();
mediaPlaying = true; ...
} else {
...
myAudio.stop();
mediaPlaying = false; ...
}
}
●

PhoneGap Sample - jQuery
jQuery makes things easier
-- Before jQuery executes -----------------------------------
<div id="aLink">hello</div>
<span class='foo'>ice</span>
<span class='foo'>cream</span>
<span class='foo'>sandwich</span>
●
-- Do jQuery -------------------------------------------------
$("#aLink").html("<a href='http://google.com'>Google</a>");
$(".foo").text("jelly"); $(".foo").eq(1).text("bean");
●
-- After jQuery executes ------------------------------------
<div id="aLink"><a href='http://google.com'>Google</a></div>
<span class='foo'>jelly</span>
<span class='foo'>bean</span>
<span class='foo'>jelly</span>

PhoneGap Sample - AJAX
// retrieve a webpage via PhoneGap
// not really applicable in normal AJAX calls, i.e. can't test in browser
●
$.get(url, function(data){
// data contains page source code
// process via Javascript
var pos_end = data.indexOf(" like");
var pos_start = data.indexOf(">", pos_end - 10);
$("#divContent").text(data.substring(pos_start+1, pos_end) + " likes");
});
● Your browser's BFFs
○ View source
○ Right click > Inspect element
(Chrome/Chromium/Firefox with Firebug/Opera)
○ WYSI(NOT)WYG
■ Facebook / Twitter

PhoneGap Sample - jQuery
$.get(url, function(data){
// process via jQuery
var element = $("<div></div>").append(data); var msg = '';
element.find(".tweets").each(function(i){
msg += $(this).find(".tweet-text").text() + "<hr>";
});
$("#divContent").html(msg);
});
●
● Doh!
○ <script> in data messes things up
○ White screen of death
● Don't waste time. Ask help / find alternative

Hackaway
● Make an app!
○ No limitations
○ Brunei site tie-in possibilities
■ Brunei Post Office - online services
■ Borneo Bulletin
● Possible features:
○ Map
○ Tweet list
○ Facebook
● Upload your code to GitHub

● PhoneGap
○ http://phonegap.com
● jQuery
○ http://jquery.com
● Github
○ https://github.com
○ https://github.com/thewheat/PhoneGapSample
● Artwork acknowledgements
○ CC-BY-NC: http://phonegap.com/artwork/
○ CC: http://android.com/developers/branding.html
● Illumination Software Creator
○ http://lunduke.com
●
Links & Stuff

Installing the Tools (Windows)
● c:android
○ readme.txt
● SDK
○ install 1..*.exe to c:
androidsdk
○ unzip updates in c:
androidsdk
■ 2...*.zip (platform
tools)
■ 3...*.zip (Android
2.2 files)
● Eclipse
○ unzip 4....*.zip to c:
eclipse (Eclipse
Classic 3.7.2 with
updates)
○ install ADT
●
● PhoneGap
○ http://phonegap.com
○ unzip to c:android
●

So you want to Develop on Android....

Recommandé

Recommandé

Contenu connexe

En vedette

En vedette (20)

Similaire à So you want to Develop on Android....

Similaire à So you want to Develop on Android.... (20)

Dernier

Dernier (20)

So you want to Develop on Android....