Tải bản đầy đủ (.pdf) (155 trang)

Luận văn: Lập trình và kiến thức về phonegap Full

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (3.5 MB, 155 trang )

Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 1

MC LC
LI NÓI U 5
Các tài liu liên quan 6
I.Events 7
1.1.Hiu thêm v events 7
1.2.Cách s dng EVENTS LISTENER 8
1.3.Hiu thêm v các dng s kin EVENT TYPES 9
1.3.1.Backbutton 9
1.3.2.Deviceready 10
1.3.3.Menubutton 11
1.3.4.Pause 12
1.3.5.Resume 13
1.3.6.Searchbutton 14
1.3.7.Online 15
1.3.8.Offline 16
1.3.9.Mt ví d đn gin v s phn hi li các s kin events 17
1.3.10.Mt ví d đn gin v vic phn hi li các s kin Button Events 18
II.Cách làm vic vi thit b, mng network, và các thông báo notifications 20
2.1.Cách ly thông tin t thit b 20
2.1.2.Cách ly v tên ca thit b Device Name 20
2.1.3.Cách ly v thông tin phiên bn phonegap 21
2.1.4.Cách ly v nn tng thit b Device Platform 21
2.1.5.Cách ly v ID quc t ca thit b UUID 21
2.1.6.Cách ly v thông tin phiên bn h điu hành 22
2.1.7.Ví d v cách ly thông tin ca thit b 22
2.2.Cách kim tra 1 mng network 23
Cách xác đnh dng kt ni 24
2.3.Cách s dng các thông báo NOTIFICATIONS 26


2.3.1.Cách s dng Alerts 26
2.3.2.Cách s dng hp thoi tng tác Confirmation Dialogs 27
2.3.3.Cách s dng Beeps 28
2.3.4.Cách s dng ch đ rung Vibrations 29
2.3.5.Ví d v cách s dng tt c 4 loi thông báo Notifications 29
III.Gia tc k Accelerometer 32
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 2

3.1.Th nào là gia tc k Accelerometer ? 32
3.2.Cách s dng gia tc k Accelerometer 32
3.3.Các ng dng dùng gia tc k Accelerometer 33
3.4.Cách s dng đi tng gia tc k ACCELERATION OBJECT 36
3.5.Cách s dng các phng thc ACCELEROMETER METHODS 37
3.5.1.Phng thc getCurrentAcceleration 37
3.5.2.Phng thc watchAcceleration 38
3.5.3.Phng thc clearWatch 39
3.6.La chn cu hình ACCELEROMETER OPTION 40
3.7.Ví d v cách s dng gia tc k ACCELEROMETER 40
Cách thc ví d hot đng 41
IV.Ví trí đa lý Geolocation 42
4.1.Th nào là v trí đa lý Geolocation ? 42
4.2.Cách s dng Geolocation 42
4.3.Các mu ng dng v Geolocation 42
4.4.Các đi tng POSITION, POSITIONERROR, và COORDINATES 45
4.4.1.i tng Position Object 45
4.4.2.i tng PositionError 46
4.4.3.i tng Coordinates Object 46
4.5.Ví d minh ha v geolocation 46
Cách ví d hot đng 47

4.6.Cách ci thin giao din và tri nghim ca ngi dùng 48
V.Media 52
5.1.Các Media Files là gì ? 52
5.2.Cách s dng các Media Files 52
5.3.Các ng dng mu s dng media API 52
5.4.i tng MEDIA OBJECT 55
5.5.Cách s dng các phng thc methods 56
5.5.1.phng thc media.getCurrentPosition 56
5.5.2.Phng thc media.getDuration 57
5.5.3.Phng thc media.pause 58
5.5.4.Phng thc media.play 59
5.5.5.Phng thc media.release 61
5.5.6.Phng thc media.seekTo 61
5.5.7.Phng thc media.startRecord 62
5.5.8.Phng thc media.stop 63
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 3

5.5.9.Phng thc media.stopRecord 64
5.5.10.Kim soát li MediaError 65
5.5.11.Ví d v vic s dng media api 66
VI.Lu tr Storage 73
6.1.im khác bit gia Session Storage và Local Storage ? 75
6.2.Cách s dng local storage 76
6.3.Cách s dng đi tng DATABASE OBJECT 77
6.3.1.Cách to và Cách m 1 database 77
6.3.2.Cách chy 1 sql Query 78
6.3.3.Cách phân tích và tin x lý các câu lnh SQL (phòng chng SQL injection) 81
6.3.4.Các giao dch Transactions 82
6.4.Cách xem 1 tp kt qu 84

6.5.iu chnh li 86
6.6.Ví d v cách xây dng 1 database đn gin : 89
VII.Files 91
7.1.H thng FILESYSTEMS 91
7.2.Tìm hiu v các th mc dn DIRECTORIES và các files 92
7.2.1.Cách s dng đi tng DirectoryEntry Object 92
7.2.2.getMetadata 93
7.2.3.setMetadata 94
7.2.4.moveTo 95
7.2.5.copyTo 96
7.2.6.toURI 97
7.2.7.remove 97
7.2.8.getParent 98
7.2.9.createReader 98
7.2.10.getDirectory 99
7.2.11.getFile 99
7.2.12.removeRecursively 100
7.3.metadata 101
7.4.FileError 102
7.5.Flags 102
7.6.LocalFileSystem 103
7.7.DirectoryReader 104
7.8.Cách s dng đi tng FileEntry Object 105
7.8.1.getMetadata 106
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 4

7.8.2.moveTo 107
7.8.3.copyTo 108
7.8.4.toURI 109

7.8.5.remove 109
7.8.6.getParent 109
7.8.7.createWriter 110
7.8.8.file 111
7.9.Cách đc các files - FileReader 111
7.9.1.readAsDataURL 112
7.9.2.abort 113
7.9.3.readAsText 114
7.10.Cách đc các files – FileWriter 116
7.11.Cách truyn dn files – FileTransfer 120
7.11.1.upload 120
7.11.2.download 124
7.11.3.abort 125
7.11.4.onprogress 125
7.12.FileTransferError 126
VIII.Camera 127
8.1.Cách truy cp 1 nh Picture 127
8.2.Cách thit lp các cu hình trong Camera Options 139
8.2.1.Quality 140
8.2.2.destinationType 141
8.2.3.sourceType 143
8.2.4.allowEdit 145
8.2.5.encodingType 146
8.2.6.targetHeight và targetWidth 146
8.2.7.mediaType 146
8.2.8.saveToPhotoAlbum 147
8.3.Làm vic vi các vn đ xy ra vi camera 147
IX.Splashscreen 151
10.1.Cách phn quyn Permissions 151
Android 151

iOS 151
10.2.Cách thit lp 151
10.3.show 152
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 5

10.4.hide 153

LI NÓI U
1 đim cá nhân mình rt thích  Phonegap, đó chính là tính đn gin và hu nh
không có tính ràng buc. Phonegap đc gi là framework tuy nhiên nó không ging nh 1
vài framework PHP mà mình đã tng hc, vi nhng framework PHP này, nó đnh ngha li
hoàn toàn cách bn vit mã code, và nó đòi hi bn phi hiu rõ sâu rng v các thành
phn h thng bên trong, thì bn mi có th lp trình thông tho đc. Vi Phonegap, nó
không kìm kp bn vào trong 1 h thng có 1 quy chun riêng ri rm nào c, bn có th t
do thoi mái lp trình theo cách mà bn mun (tuy nhiên cái gì cng có 2 mt ca nó), bn
ch cn nm bt 1 công ngh duy nht - công ngh nn Web(bao gm HTML5, Javascript,
CSS), b qua gánh nng cn phi nm bt và hiu rõ v các công ngh bên trong mi nn
tng (Android, iOS, Blackberry, Windowphone, ầ) mà bn vn có th to ra đc các ng
dng “vit mt ln, biên dch qua cloud và chy khp ni – tng thích vi hu ht các nn
tng h điu hành di đng hin ti”.
Tài liu đc vit ging nh 1 bn ghi chép, ghi li nhng th mà mình đã đc đc t các
ebook ting anh, do vy b cc sp xp ca nó có th cha chính xác, cách trình bày không
theo chun 1 ebook nào c và nhiu ch vit cha rõ ngha và không mch lc do hn ch
v ngoi ng ca bn thân mình. Tài liu mang đm tính cht cá nhân do vy bn s bt
gp trong tài liu này nhiu đon kí t in đm, in màu, c ch ln bt thng và đc tô
màu khác nhau - đó là các đon có liên quan đn nhau hay là nhng ghi chú quan trng mà
bn cn phi đc k.
Ni dung trong tài liu này đc da trên các cun ebook: “Beginning Phonegap -
Thomas Myer”, “PhoneGap Essentials - John M. Wargo”,

“Apache Cordova Documentation 2.2.0 – Phonegap team”, và 1 s gii thích, đnh ngha
v kin trúc ca HTML5 t W3C.org. Tài liu này không đ cp ti đy đ các hàm APIs
đc Phonegap h tr. C th, các phn sau b lc b: Capture, Compass, Contacts,
Globalization, Guides (do mình không có thi gian đ vit nt, và mình cng không s
dng đn các phn b lc b này)
Nu có thc mc hay góp ý gì, các bn có th đng ký ngay 1 nick vào din đàn
www.phonegap.vn/forum đ đt câu hi trc tip, các MOD và ADMIN s tr li câu hi
ca bn trong thi gian sm nht.

Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 6

Các tài liu liên quan
 “Lp trình hng đi tng trong Javascript và các kiu mu thit k”:
/>javascript-va-cac-kieu-mau-thiet-ke
 “Cách ti u hóa môi trng lp trình ng dng cho Android”:
/>cho-android-tng-tc-my-o-android
 Hoc đn gin truy cp vào th mc chia s sau: (rt có
th trong 1 thi gian na, mình s vit 1 ebook liên quan đn Jquery Mobile, nu có
thì các bn s thy nó xut hin trong th mc chia s này)



Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 7

I.Events
1 s kin events trong phonegap tng đi ging s kin trong javascript.1 hành đng (thao
tác) đc thc hin trên thit b - ví d nh document object model (DOM) đã đc ti xong
và do đó thit b  trng thái sn sàng “ready” - và hin ti phonegap có th thc hin 1 vài

th đ tr li(đáp ng) li s kin này
1.1.Hiu thêm v events
 đn gin hóa, ta hiu 1 event là bt c hành đng nào mà có th đc xác đnh (nhn
bit) bi phonegap.trong lp trình javascript truyn thng, bt c phn t nào trên 1 trang
page cng có th có các s kin event nào đó, và nó có th đc kích hot bi 1 vài mã
javascript.ví d nh 1 s kin onrollover trên 1 link có th gây ra xut hin 1 bng pop-up,
hay s kin onclick có th gây ra 1 bng hp thoi xem trc
Tóm li, s kin events có th là click chut, 1 image loading, rolling over trên 1 link nào đó
hay nhng đi tng DOM khác, vic la chn 1 trng input field trong 1 form, submitting
1 form, hay s kin gõ 1 phím bt kì trên bàn phím.v đa s thì tt c các dng s kin
events trên cng có th đc s dng khi ta phát trin các ng dng s dng phonegap.tuy
nhiên có nhng s kin ch đc đnh ngha bên trong phonegap nh sau :
 deviceready
 pause
 resume
 online
 offline
 backbutton
 batterycritical
 batterylow
 batterystatus
 menubutton
 searchbutton
 startcallbutton
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 8

 endcallbutton
 volumedownbutton
 volumeupbutton

trong tt c các s kin events trên thì s kin deviceready là quan trng nht mà ta phi
xem xét ti.không có nó thì ng dng ca ta s không bit khi nào phonegap đã đc load
hoàn toàn.khi nó đc kích hot, ta có th gi 1 cách an toàn bt c các hàm PhoneGap
function nào và do đó có th ln lt truy cp an toàn vào các API bn đa
khi s kin deviceready event đc kích hot, thì ta bit đc 2 điu : DOM đã đc load,
và do vy đã có PhoneGap API
1.2.Cách s dng EVENTS LISTENER
đ s dng bt c s kin event nào, thì ta s cn phi s dng 1 event listener.nh ví d
sau : dùng đ xác đnh s kin deviceready.ta phi làm nh sau :
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap Device Ready Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function
onDeviceReady() {
// call the phonegap api
document.addEventListener(“pause”, onPause, false);
document.addEventListener(“resume”, onResume, false);
}

function
onPause(){
}
function
onResume(){
}
</script>

</head>
<body>
</body>
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 9

</html>

Ví d trên nhc nh ta rng deviceready có th là 1 s kin nhng nó li không phi là s
kin chun tc trong trình duyt, nó ch hot đng và nhn bit bi trong phonegap.nu ta
th chy s kin này trong 1 trình duyt thông thng thì nó không bao gi đc kích hot
1.3.Hiu thêm v các dng s kin EVENT TYPES
1.3.1.Backbutton
S kin backbutton đc kích hot khi ngi dùng n vào nút Back trên thit b Android
 xác đnh s kin event này, thì ta cn đng ký 1 event listener nh sau :
document.addEventListener(“backbutton”, onBackButton, false);
function onBackButton(){
//handle the back button
}

Cng ging nh các s kin event khác thì ta không nên đng ký ging nh th này cho ti
khi ta đã xác đnh đc s kin deviceready event:

<!DOCTYPE html>
<html>
<head>
<title>PhoneGap backbutton Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);

function onDeviceReady() {
// Register the event listener
document.addEventListener(“backbutton”, onBackButton, false);
}
// Handle the back button
//
function
onBackButton() {
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 10

}
</script>
</head>
<body>
</body>
</html>

1.3.2.Deviceready
Nh đã nhc đn t trc, s kin deviceready là s kin quan trng nht mà ta có th
xác đnh.theo đó ta cn phi xác đnh s kin này đu tiên trc khi ta làm bt c nhng gì
khác bi vì khi nó đc kích hot thì đng ngha vi vic ta chc chn gi đc các
PhoneGap API
document.addEventListener(“deviceready”, onDeviceReady, false);
function
onDeviceReady(){
//ready!
}

 dành cho nhng ngi phát trin trên BlackBerry OS 4.6, thì RIM Browserfield không

h tr hàm s kin event này, nên ta cn s dng PhoneGap.available đ thay th nh
sau :
function onLoad() {
var intervalID = window.setInterval(
function() {
if (PhoneGap.available) {
window.clearInterval(intervalID);
onDeviceReady();
}
},
500
);
}
function
onDeviceReady() {
// use the phonegap api!
}

Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 11

1.3.3.Menubutton
S kin menubutton đc kích hot khi ngi dung n vào nút Menu trên thit b android
 xác đnh s kin này, thì ta cn đng ký 1 event listener nh sau :
document.addEventListener(“menubutton”, onMenuButton, false);
function
onMenuButton(){
//handle the menu button
}


Cng ging nh các events khác, ta không nên đng ký kiu nh th này cho ti khi ta xác
đnh đc s kin deviceready
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap menubutton Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function
onDeviceReady() {
// Register the event listener
document.addEventListener(“menubutton”, onMenuButton, false);
}
// Handle the menu button
//
function
onMenuButton() {
}
</script>
</head>
<body>
</body>
</html>

Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 12

1.3.4.Pause
Khi s kin pause đc kích hot là khi 1 ng dng đc đt vào ch đ chy nn

 xác đnh s ki này, ta đng kí 1 event listener nh sau :
document.addEventListener(“pause”, onPause, false);
function onPause(){
//handle the pause event
}

Hay ta làm theo nh đúng tiêu chun ging nh  trên nh sau :

<!DOCTYPE html>
<html>
<head>
<title>PhoneGap pause Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
// Register the event listener
document.addEventListener(“pause”, onPause, false);
}
// Handle the pause
//
function onPause() {
}
</script>
</head>
<body>
</body>
</html>




Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 13

1.3.5.Resume
S kin resume đc kích hot khi 1 ng dng đang  trng thái tm dng (chy nn)
đc kích hot tr li làm vic
 xác đnh s ki này, ta đng kí 1 event listener nh sau :
document.addEventListener(“resume”, onResume, false);
function onResume(){
//handle the resume event
}

Cng ging nh các events khác, ta không nên đng ký kiu nh th này cho ti khi ta xác
đnh đc s kin deviceready
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap resume Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
// Register the event listener
document.addEventListener(“resume”, onResume, false);
}
// Handle the resume
//
function onResume() {
}

</script>
</head>
<body>
</body>
</html>


Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 14

1.3.6.Searchbutton
S kin searchbutton đc kích hot khi ngi dùng n vào nút Search trên thit b android
 xác đnh s ki này, ta đng kí 1 event listener nh sau :
document.addEventListener(“searchbutton”, onSearchButton, false);
function onSearchButton(){
//handle the search button
}

Cng ging nh các events khác, ta không nên đng ký kiu nh th này cho ti khi ta xác
đnh đc s kin deviceready
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap searchbutton Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
// Register the event listener
document.addEventListener(“searchbutton”, onSearchButton, false);

}
// Handle the search button
//
function onSearchButton() {
}
</script>
</head>
<body>
</body>
</html>



Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 15

1.3.7.Online
S kin online đc kích hot khi 1 ng dng phonegap đang online (điu này có ngha là
nó đang đc kt ni internet).đây là 1 s kin mi đc thêm vào trong phiên bn 0.9.6 và
nó ch đc h tr trên các thit b iOS, Android, and BlackBerry
 xác đnh s ki này, ta đng kí 1 event listener nh sau :
document.addEventListener(“online”, isOnline, false);
function isOnline(){
//handle the online event
}

Cng ging nh các events khác, ta không nên đng ký kiu nh th này cho ti khi ta xác
đnh đc s kin deviceready
<!DOCTYPE html>
<html>

<head>
<title>PhoneGap online Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
// Register the event listener
document.addEventListener(“online”, isOnline, false);
}
// Handle the online event
//
function isOnline() {
}
</script>
</head>
<body>
</body>
</html>

Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 16

1.3.8.Offline
S kin offline đc kích hot khi 1 ng dng phonegap đang offline (điu này có ngha là
nó không kt ni internet).đây là 1 s kin mi đc thêm vào trong phiên bn 0.9.6 và nó
ch đc h tr trên các thit b iOS, Android, and BlackBerry
 xác đnh s ki này, ta đng kí 1 event listener nh sau :
document.addEventListener(“offline”, isOffline, false);
function isOffline(){
//handle the offline event

}


Cng ging nh các events khác, ta không nên đng ký kiu nh th này cho ti khi ta xác
đnh đc s kin deviceready
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap offline Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
// Register the event listener
document.addEventListener(“offline”, isOffline, false);
}
// Handle the offline event
//
function isOffline() {
}
</script>
</head>
<body>
</body>
</html>

Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 17

1.3.9.Mt ví d đn gin v s phn hi li các s kin events

Ta to ra ng dng đn gin, phn hi li các s kin pause và resume events :
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap Event Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
// Register the event listeners
document.addEventListener(“pause”, onPause, false);
document.addEventListener(“resume”, onResume, false);
}
// Handle the pause
//
function
onPause() {
alert(“Paused!”);
}
// Handle the resume
//
function
onResume() {
alert(“Resumed!”);
}
</script>
</head>
<body>
</body>
</html>




Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 18

Chng trình chy nh th nào

event listener là 1 khóa quan trng, nó dùng đ xác đnh khi nào s kin deviceready
event đc kích hot và khi s kin này đc kích hot thì ta bit đc rng ta có th gi 1
cách an toàn các API còn li ca phonegap

khi nó đc kích hot, thì s kin deviceready event làm chy hàm onDeviceReady()
function và ln lt trong hàm này đng ký 2 event listener mi, 1 cái cho s kin pause
event và cái th 2 cho s kin resume event

1.3.10.Mt ví d đn gin v vic phn hi li các s kin Button
Events

<!DOCTYPE html>
<html>
<head>
<title>PhoneGap Button Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
// Register the event listeners
document.addEventListener(“searchbutton”, onSearch, false);
document.addEventListener(“menubutton”, onMenuButton, false);

document.addEventListener(“backbutton”, onBackButton, false);
}
// Handle the backbutton
//
function
onBackButton() {
alert(“You hit the back button!”);
}
// Handle the menubutton
//
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 19

function
onMenuButton() {
alert(“You hit the menu button!”);
}
// Handle the searchbutton
//
function
onSearchButton() {
alert(“You hit the search button!”);
}
</script>
</head>
<body>
</body>
</html>

Chng trình chy nh th nào

Chng trình đn gin là đu tiên tin hành kim tra đ chc chn rng ng dng
phonegap đã sn sàng hay cha, và sau đó đng ký 3 event listeners, tng cái 1 dành cho
các nút ca thit b nh Search, Menu, và Back buttons









Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 20

II.Cách làm vic vi thit b, mng network, và các thông
báo notifications
2.1.Cách ly thông tin t thit b
Phonegap có 1 runtime object đc gi là đi tng thit b device, đ lu gi thông tin có
ích v thit b.sau đây là nhng thuc tính ca đi tng device :
 device.name – là tên ca thit b (ví d nh my iphone)
 device.phonegap – phiên bn ca phonegap
 device.platform – loi ca thit b (ví d nh iphone)
 device.uuid – s id ca thit b
 device.Version – phiên bn h điu hành OS đang chy
quan trng phi chú ý rng : device đc gán thành đi tng window object, do vy nó
hoàn toàn có phm vi toàn cc.hiu theo cách khác, c 2 bin sau đu tham chiu ti cùng
thit b device :
//both of these reference the same device
var myPhoneName = window.device.name;

var myPhoneName = device.name;

trong phn này ta s hc ly v các thông tin sau :
 tên ca thit b device
 phiên bn phonegap
 ID quc t dùng đ xác đnh thit b duy nht (UUID)
 Phiên bn h điu hành ca thit b
2.1.2.Cách ly v tên ca thit b Device Name
 ly v tên ca thit b ta s dng device.name nh sau:
var myPhoneName = device.name;
giá tr này đc tr v đc thit lp bi nhà sn xut và có th bin đi t sn phm này
đn sn phm khác và bin đi ngay c trên cùng 1 phiên bn sn phm.ví d, đây là 1
danh sách ca các giá tr tr v cho các loi đin thoi khác nhau :
 Android Nexus One tr v là Passion ( đây là tên mã sn phm)
 Android Motorola Droid tr v là voles
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 21

 BlackBerry Bold 8900 tr v là 8900
 iPhone tr v là tên đc thit lp trong iTunes( ví d nh Tom‟s phone )
thuc tính device.name đc h tr trong các thit b Android, BlackBerry, và iPhone
2.1.3.Cách ly v thông tin phiên bn phonegap
đ ly v thông tin phiên bn phonegap trên thit b, ta s dng thuc tính
device.phonegap nh sau :
var myDevicePhoneGap = device.phonegap;
thuc tính device.phonegap đc h tr trên các thit b Android, Blackberry, và iPhone
2.1.4.Cách ly v nn tng thit b Device Platform
cách ly v tên ca h điu hành trên thit b, ta s dng device.platform nh sau:
var myDevicePlatform = device.platform;
ph thuc vào thit b device, câu lnh này tr v các th sau :

 android
 blackberry
 iphone
 webOS
Chú ý: theo kinh nghim ca lp trình viên thì các thit b iphone tr v là ios và 1
vài thit b blackberry tr v phiên bn h điu hành đ thay th cho tên ca h điu hành.ví
d nó có th tr v 1.10.3.5 thay cho blackberry
2.1.5.Cách ly v ID quc t ca thit b UUID
mi thit b điu phi có s UUID, s này đc thêm vào thit b bi nhà sn xut. UUID có
th có nhng chiu dài khác nhau ph thuc vào thit b, nó có th luôn luôn đc đnh
ngha nh là 1 mu model và nn tng platform.ví d, android s dng 1 s kiu int ngu
nhiên 64-bit; blackberry s dng mã PIN 9 kí t; và iphone s dng 1 chui string là giá tr
ca hàm bm hash
cách ly UUID ca thit b, ta s dng device.uuid nh sau :
var myDeviceID = device.uuid;
thuc tính device.uuid đc h tr trên các thit b Android, BlackBerry, và iPhone
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 22

2.1.6.Cách ly v thông tin phiên bn h điu hành
cách ly v tên phiên bn h điu hành ca thit b, ta s dng device.version nh sau :
var myDeviceOS = device.version;
ph thuc vào h điu hành, ta s ly đc v các giá tr khác nhau.ví d trên android, h
điu hành Froyo OS tr v là 2.2 và Éclair OS tr v là 2.1, 2.0.1 hay 2.0. BlackBerry Bold
9000 s dng OS 4.6 thì tr v là 4.6.0.282 và 1 iphone chy IOS 3.2 tr v là 3.2
thuc tính device.version đc h tr trên các thit b Android (2.1 and higher), BlackBerry,
and iPhone
2.1.7.Ví d v cách ly thông tin ca thit b
ta to ra 1 đon mã đn gin dùng đ cho phép ta s dng các phn t device đ ly v
các thông tin v thit b :


<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”

<html>
<head>
<title>My Device</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
// Use an event listener to detect if PhoneGap is ready
//
function onLoad() {
document.addEventListener(“deviceready”, onDeviceReady, false);
}
// okay, PhoneGap is ready
//
function
onDeviceReady() {
var myDiv = document.getElementById(„props‟);
myDiv.innerHTML = „Device Name: „ + device.name + „<br />‟ +
„Device PhoneGap: „ + device.phonegap + „<br />‟ +
„Device Platform: „ + device.platform + „<br />‟ +
„Device UUID: „ + device.uuid + „<br />‟ +
„Device Version: „ + device.version + „<br />‟;
Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 23

}
</script>
</head>
<body onload=”onLoad()”>

<p id=”props”>Loading device properties </p>
</body>
</html>

Cách thc chng trình hot đng
Trong ví d này, ta to ra 1 tài liu HTM đn gin, đu tiên ti v th vin phonegap.js.tip
theo ta vit 1 hàm onLoad() function dùng đ đng ký 1 event handler bng cách s dng
addEventListener.đc bit, ta mun tuân theo s kin deviceready event, và khi nó đc
kích hot thì nó s chy hàm onDeviceReady() function.
Hàm onDeviceReady() function làm 2 th : th nht là nó đin vào 1 đon vn vào trong
document DOM có id là “props” bng cách s dng getElementById, sau đó nó in ra
thông tin v thit b vào trong phn t DOM đó
Nu ta s dng JQuery, thì ta có th đn gin vit nh sau :
function onDeviceReady() {
$(“#props”).html(„Device Name: „ + device.name + „<br />‟ +
„Device PhoneGap: „ + device.phonegap + „<br />‟ +
„Device Platform: „ + device.platform + „<br />‟ +
„Device UUID: „ + device.uuid + „<br />‟ +
„Device Version: „ + device.version + „<br />‟);
}

2.2.Cách kim tra 1 mng network
Vi 1 ngi lp trình nn web hay destop, thì ta thng gi đnh rng kt ni mng network
luôn luôn đc bt thông qua kt ni có dây hoc không dây.tuy nhiên khi ta bt đu làm
vic vi các thit b di đng, ta không th luôn luôn gi đnh nh vy.tín hiu kt ni có th
không tn ti hoc có th rt yu không n đnh, hay ngi dùng có th chuyn đi t
cellular sang wifi hay ngc li
May mn cho ta là phonegap API có cha 1 đi tng là Connection object, đi tng này
cho phép ta truy cp vào thông tin kt ni cellular và WiFi ca thit b
Phonegap cho ngi mi hc

Ngô Quang Trung – email: / www.phonegap.vn/forum 24

Cách xác đnh dng kt ni
 xác đnh dng ca kt ni mng network thì ta s phi s dng connection.type nh
sau :
function checkConnection(){
var myState = navigator.network.connection.type;
//return a specific state
}


Hàm connection.type s tr v 1 trong s danh sách các dng kt ni có th sau :
 UNKNOWN
 ETHERNET
 WIFI
 CELL_2G
 CELL_3G
 CELL_4G
 NONE
1 ý tng tt đ làm vic vi các bng thông đip đ thông báo ti ngi dùng.ta s làm
nh sau :
function checkConnection() {
var networkState = navigator.network.connection.type;
var states = {};
states[Connection.UNKNOWN] = „Unknown connection‟;
states[Connection.ETHERNET] = „Ethernet connection‟;
states[Connection.WIFI] = „WiFi connection‟;
states[Connection.CELL_2G] = „Cell 2G connection‟;
states[Connection.CELL_3G] = „Cell 3G connection‟;
states[Connection.CELL_4G] = „Cell 4G connection‟;

states[Connection.NONE] = „No network connection‟;
alert(„Connection type: „ + states[networkState]);
}

Phonegap cho ngi mi hc
Ngô Quang Trung – email: / www.phonegap.vn/forum 25

 ví d trên, nu dng kt ni là NONE thì thông báo s cha thông đip là „No network
connection‟
ví d v cách kim tra mng network kh dng

<!DOCTYPE html>
<html>
<head>
<title>Connectivity Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script>
<script type=”text/javascript” charset=”utf-8”>
document.addEventListener(“deviceready”, onDeviceReady, false);
function onDeviceReady() {
checkConnection();
}
function
checkConnection() {
var networkState = navigator.network.connection.type;
var states = {};
states[
Connection.UNKNOWN] = „Unknown connection‟;
states[Connection.ETHERNET] = „Ethernet connection‟;
states[Connection.WIFI] = „WiFi connection‟;
states[Connection.CELL_2G] = „Cell 2G connection‟;

states[Connection.CELL_3G] = „Cell 3G connection‟;
states[Connection.CELL_4G] = „Cell 4G connection‟;
states[Connection.NONE] = „No network connection‟;
alert(„Connection type: „ + states[networkState]);
}
</script>
</head>
<body>
<p>A dialog box will report the network state.</p>
</body>
</html>


×