2.3 .Cách sử dụng các thông báo NOTIFICATIONS
2.3.3 .Cách sử dụng Beeps
Thỉnh thoảng ta không cần tới 1 hiện thị thông báo – mà đơn giản chỉ cần 1 tiếng beep để ra hiệu thơng báo khi người dùng làm gì đó.để tạo ra tiếng beep, ta sử dụng hàm
notification.beep như sau :
navigator.notification.beep(2);
hàm này cần 1 tham số truyền vào, nó là 1 kiểu int dùng để xác định số tiếng beep mà ta muốn phát
hàm này được hỗ trợ trong các thiết bị Android, BlackBerry, webOS, và iPhone
Chú ý: android sẽ chơi bản nhạc thông báo Notification mặc định được thiết lập ở Settings ➪Sound and Display panel.còn iphone cũng sẽ từ chối tham số tiếng beep truyền vào
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 29 2.3.4.Cách sử dụng chế độ rung Vibrations
thỉnh thoảng khơng phải lúc nào cũng thích hợp để thiết bị phát ra tiếng, do đó phonegap cung cấp 1 hàm sử dụng chế độ rung là notification.vibrate, hàm này cần 1 tham số để truyền vào là thời gian tính bằng mili giây như sau :
navigator.notification.vibrate(2000);
hàm này được hỗ trợ trong các thiết bị Android, BlackBerry, webOS, và iPhone
Chú ý: iphone sẽ từ chối tham số truyền vào và nó sẽ rung theo thời gian được thiết lập sẵn
2.3.5.Ví dụ về cách sử dụng tất cả 4 loại thông báo Notifications
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
<html> <head>
<title>Notifications</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script> <script type=”text/javascript” charset=”utf-8”>
// Wait for PhoneGap to load //
function onLoad() {
document.addEventListener(“deviceready”, onDeviceReady, false); } // PhoneGap is ready // function onDeviceReady() { // Empty }
// Show a custom alert //
function showAlert() { navigator.notification.alert( „Game Over!‟, // message
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 30
alertCallback, //callback „Game Over‟, // title Available for download on Wrox.com Available for download on Wrox.com Using Notifications ❘ 69 „Done‟ // buttonName ); }
//alert call back
function alertCallback(){
//do something... like calculate final score }
// process the confirmation dialog result function onConfirm(button) {
alert(„You selected button „ + button); }
// Show a custom confirmation dialog //
function showConfirm() { navigator.notification.confirm( „Game Over!‟, // message
onConfirm, // callback to invoke with index of button pressed „Game Over‟, // title
„Restart,Exit‟ // buttonLabels ); } // Beep twice // function playBeep() { navigator.notification.beep(2); }
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 31 // function vibrate() { navigator.notification.vibrate(4000); } </script> </head> <body onload=”onLoad()”>
<p><a href=”#” onclick=”showAlert(); return false;”>Show Alert</a></p>
<p><a href=”#” onclick=”showConfirm(); return false;”>Show Confirmation</a></p> <p><a href=”#” onclick=”playBeep(); return false;”>Play Beep</a></p>
<p><a href=”#” onclick=”vibrate(); return false;”>Vibrate</a></p> </body>
</html>
Cách thức ví dụ hoạt động
ở ví dụ này, trong hàm onDeviceReady(), ta để nó trống rỗng bởi vì tài liệu document chính đã chứa 1 dãy các link dùng để gọi các hàm function và lần lượt chúng sẽ kích hoạt các thơng báo khác nhau
ví dụ, bằng cách ấn vào link đầu tiên hàm showAlert() sẽ được kích hoạt và nó sẽ hiện thị 1 thơng báo alert tùy chỉnh.link thứ 2 sẽ kích hoạt hàm showConfirm() hiện thị ra 1 hộp thoại confirmation box
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 32
III.Gia tốc kế Accelerometer
3.1.Thế nào là gia tốc kế Accelerometer ?
gia tốc kế Accelerometer là 1 thiết bị dùng để ghi lại chuyển động trong không gian 3 chiều XYZ
để hình dung được 3 chiều XYZ, thì ta đặt thiết bị lên trên 1 bề mặt phẳng giống như trên mặt bàn.ta giả sử rằng bề mặt này có rất ít ma sát và ví dụ như ta có thể đặt thiết bị sang trái và sang phải mà khơng cần phải nâng nó lên.mục đích của ví dụ này là giúp ta hình dung được nơi ta đặt thiết bị tại vị trí (0,0,0) trong khơng gian tọa độ.bất cứ cách nào mà ta dùng để di chuyển thiết bị thì sẽ dẫn đến 1 sự thay đổi trong hệ tọa độ
nếu thiết bị là mỏng nằm trên mặt bàn và khi ta di chuyển nó sang trái hay sang phải thì chính là ta di chuyển nó dọc theo trục X.ta di chuyển nó sang trái là ta cho nó 1 kết quả âm, và ta di chuyển nó sang phải thì ta cho nó kết quả dương.nếu ta di chuyển thiết bị ra xa bàn hay tới gần chỗ ta thì chính là ta đang di chuyên nó trên trục Y.nếu di chuyển nó ra xa thì ta được kết quả dương theo trục Y, và nếu di chuyển nó lại gần thì ta được kết quả âm trục Z được miêu tả là chiều lên xuống và được thêm vào làm chiều thứ 3 của hệ trục tọa độ.nếu ta cầm lấy thiết bị và cầm nó tiến đến mặt thì ta được kết quả dương theo trục Z.nếu ta cho thiết bị xuống dưới mặt bàn thì ta được kết quả âm theo trục Z
tất nhiên rất là khó khăn khi ta dịch chuyển 1 thiết bị theo chỉ 1 trục mà không gây ảnh hưởng tới các trục khác.nếu ta cầm thiết bị lên ( ví như di chuyển nó tới gần mặt) thì ta nhận được kết quả dương đối với trục Z, nhưng cũng giống như vậy khi ta mang nó gần cơ thể hơn thì thu được kết quả âm theo trục Y……
giờ hình dung xem, chuyện gì sẽ xảy ra nếu ta tung thiết bị quay trở lại bề mặt bàn - nhớ đùng tung quá mạnh ta có thể làm vỡ nó.khi đó gia tốc kế accelerometer bên trong thiết bị sẽ xác định tất cả chuyển động dọc theo trục XYZ
3.2.Cách sử dụng gia tốc kế Accelerometer
nhớ rằng gia tốc kế có thể xác định được chuyển động, độ nghiêng, và gia tốc do đó nó dùng để tạo ra các ứng dụng sáng tạo
Làm thế nòa để tạo ra 1 ứng dụng dùng để xác định chuyển động của người và giữ các vết của chúng trong lúc người sử dụng đang thực hiện? tất cả những gì người dùng phải làm là bật ứng dụng lên và đặt thiết bị vào trong túi
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 33
Dành cho các vị trí có ánh sáng thấp, thì ta có thể tự động chụp 1 bức ảnh với camera của thiết bị nếu thiết bị vẫn hoạt động tốt
Ta có thể xây dựng 1 game mà trong đó ta điều khiển các bộ phận có tương tác với độ nghiêng hay chuyển động của thiết bị
3.3.Các ứng dụng dùng gia tốc kế Accelerometer
nếu ta có 1 chiếc iphone, và ta hầu như chắc chắn biết đến hay đã từng chơi “DoodleJump” như trong hình dưới. “DoodleJump” là 1 game dễ gây nghiện nó cho phép nhân vật của ta nhảy từ mức này tới mức khác bằng cách sử dụng gia tốc kế để xác định chuyển động sang trái/phải
1 game khá phổ biến khác là “Super Monkey Ball” như trong hình 6-2. Ý tưởng nằm đằng sau game này là hướng dẫn 1 chú khỉ nhỏ dễ thương vượt qua các chướng ngại vật khác nhau bằng cách nghiêng hay lắc iphone
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 34
Trên thiết bị android, ta cũng có “Hyperspace” như trong hình 6-3, trong đó ta sử dụng nghiêng hay chuyển động để điều khiển 1 trái bóng để đi xuyên qua các chướng ngại vật.
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 36
3.4.Cách sử dụng đối tượng gia tốc kế ACCELERATION OBJECT OBJECT
đối tượng gia tốc kế ACCELERATION OBJECT là 1 đối tượng chỉ có thể đọc và nó chứa dữ liệu gia tốc kế được chụp lại tại 1 điểm xác định trong 1 thời điểm.và đối tượng này có các thuộc tính :
X - đại lương chuyển động trên trục X, được trình bày là 1 số Y - đại lương chuyển động trên trục Y, được trình bày là 1 số Z - đại lương chuyển động trên trục Z, được trình bày là 1 số
Timestamp – mốc thời gian lúc tạo ra, được trình bày trong mili giây
Đối tượng này được tạo ra và được cư trú trong phongegap và nó trả về 1 phương thức accelerometer method như ví dụ sau :
navigator.accelerometer.getCurrentAcceleration(onSuccess, onError); //you now have access to an acceleration object
//which contains x, y, z, and timestamp data function onSuccess(acceleration) { alert(„Acceleration X: „ + acceleration.x + „\n‟ + „Acceleration Y: „ + acceleration.y + „\n‟ + „Acceleration Z: „ + acceleration.z + „\n‟ + „Timestamp: „ + acceleration.timestamp + „\n‟); };
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 37 function onError() { alert(„Sorry! Error!‟); }; 3.5.Cách sử dụng các phương thức ACCELEROMETER METHODS 3.5.1.Phương thức getCurrentAcceleration
Để lấy về gia tốc kế hiện tại theo trục XYZ thì ta phải sử dụng phương thức accelerometer.getCurrentAcceleration như sau :
navigator.accelerometer.getCurrentAcceleration(accelerometerSuccess,
accelerometerError);
dữ liệu acceleration data được trả về thông qua hàm accelerometerSuccess callback : function onSuccess(acceleration) { alert(„Acceleration X: „ + acceleration.x + „\n‟ + „Acceleration Y: „ + acceleration.y + „\n‟ + „Acceleration Z: „ + acceleration.z + „\n‟ + „Timestamp: „ + acceleration.timestamp + „\n‟) }; function onError() { alert(„ooooops!‟); }; navigator.accelerometer.getCurrentAcceleration(onSuccess, onError);
Chú ý: trên các thiết bị IOS, thì việc gọi phương thức getCurrentAcceleration() sẽ
không làm việc như cách mà ta nghĩ,dùng để thay thế cho current acceleration thì nó sẽ báo cáo về giá trị cuối cùng được báo cáo từ lời gọi PhoneGap accelerometer.để thay thế, ta sẽ cần sử dụng phương thức watchAcceleration()
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 38 3.5.2.Phương thức watchAcceleration
Phương thức watchAcceleration cho phép ta lấy về dữ liệu gia tốc kế ở 1 khoảng thời gian chính xác.nếu ta thiết lập 1 biến chứa lời gọi phương thức và chuyển tiếp vào trong 1 tham số tần suất như là 1 trong những lựa chọn, thì ta sẽ lấy về dữ liệu gia tốc kế dựa trên 1 chu kì chuẩn như sau :
function onSuccess(acceleration) { alert(„Acceleration X: „ + acceleration.x + „\n‟ + „Acceleration Y: „ + acceleration.y + „\n‟ + „Acceleration Z: „ + acceleration.z + „\n‟ + „Timestamp: „ + acceleration.timestamp + „\n‟); }; function onError() { alert(„onError!‟); };
var options = { frequency: 1000 }; // Update every second
var watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError,
options);
đoạn code ở trên sẽ tạo ra 1 thơng báo alert theo chu kì từng giây một.1 hàm hữu dụng có thể là 1 vài thứ giống như ở dưới mà trong đó các phần tử DOM ln được làm mới bên trong HTML, và do vậy nó cho ta biết sự in dữ liệu ra màn hình hữu dụng như sau :
function onSuccess(acceleration) {
var myX = document.getElementById(„my_x‟); var myY = document.getElementById(„my_y‟); var myZ = document.getElementById(„my_z‟);
var myT = document.getElementById(„my_timestamp‟); myX.innerHTML(acceleration.x); myY.innerHTML(acceleration.y); myZ.innerHTML(acceleration.z); myT.innerHTML(acceleration.timestamp); } function onError() { alert(„oooops!‟);
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 39
};
var options = { frequency: 1000 }; // Update every second
var watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError,
options);
để đoạn code trên hoạt đọng, ta phải chắc chắn là tạo ra các phần tử DOM tương ứng thích hợp như sau :
<div id=‟my_x‟></div> <div id=‟my_y‟></div> <div id=‟my_z‟></div>
<div id=‟my_timestamp‟></div>
Chú ý: trong iOS thì gia tốc kế được quan tâm đặc biệt, do vậy phonegap sẽ bị giới hạn mức chu kỳ nhỏ nhất là 40 mili giây và lớn nhất là 1000 mili giây.do vậy nếu ta yêu cầu 1 cập nhật có chu kỳ là 3000 mili giây(hay là 3 giây) thì phonegap sẽ yêu cầu 1 chu kỳ là 1000 mili giây trên thiết bị nhưng sẽ gọi hàm callback thành công lại dựa vào yêu cầu là chu kỳ 3000 mili giây
3.5.3.Phương thức clearWatch
Để ngừng việc xem các dữ liệu gia tốc kế được tạo bởi phương thức watchAcceleration(), thì ta phải sử dụng phương thức clearWatch() và tham chiếu tới biến mà ta vừa tạo ra từ trước như sau :
navigator.accelerometer.clearWatch(watchID);
thơng thường, ta sẽ kích hoạt sự kiện này thơng qua 1 nút click như sau : <button onclick=”stopWatch();”>Stop Watching</button>
Tất nhiên, ta cũng có thể gán sự kiện này tới 1 vài loại chu kỳ như sau : thu thập dữ liệu trong 30 giây rồi ngừng lại
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 40
3.6.Lựa chọn cấu hình ACCELEROMETER OPTION
Để thiết lập tần số là 5 giây, ta làm như sau :
var options = { frequency: 5000 }; // Update every 5 seconds
var watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError, options);
để thiết lập tần số thành nửa giây thì ta sử dụng như sau :
var options = { frequency: 500 }; // Update every .5 seconds
var watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError, options); 3.7.Ví dụ về cách sử dụng gia tốc kế ACCELEROMETER <!DOCTYPE html> <html> <head> <title>Acceleration Example</title>
<script type=”text/javascript” charset=”utf-8” src=”phonegap.js”></script> <script type=”text/javascript” charset=”utf-8”>
var watchID = null;
// Wait for PhoneGap to load
document.addEventListener(“deviceready”, onDeviceReady, false); // PhoneGap is ready, start watching
function onDeviceReady() { startWatch();
}
// Start watching the acceleration function startWatch() {
// Update acceleration every 3 seconds var options = { frequency: 3000 };
watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError,
options);
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 41
// Stop watching the acceleration function stopWatch() { if (watchID) { navigator.accelerometer.clearWatch(watchID); watchID = null; } }
// onSuccess: Get a snapshot of the current acceleration function onSuccess(acceleration) {
var element = document.getElementById(„accelerometer‟);
element.innerHTML = „Acceleration X: „ + acceleration.x + „<br />‟ + „Acceleration Y: „ + acceleration.y + „<br />‟ +
„Acceleration Z: „ + acceleration.z + „<br />‟ + „Timestamp: „ + acceleration.timestamp + „<br />‟;
}
// onError: Failed to get the acceleration // function onError() { alert(„oooops!‟); } </script> </head> <body>
<div id=”accelerometer”>Waiting for accelerometer...</div> <button onclick=”stopWatch();”>Stop Watching</button> </body>
</html>
Cách thức ví dụ hoạt động
Khi ứng dụng vừa load xong thì hàm startWatch() được kích hoạt.hàm này sử dụng phương thức watchAcceleration() để khởi tạo việc xem dữ liệu gia tốc kế và báo cáo lại thông tin về tọa độ trục XYZ và timestamp rồi in ra hiện thị HTML
Ngô Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 42
IV.Ví trí địa lý Geolocation
4.1.Thế nào là vị trí địa lý Geolocation ?
Geolocation bao hàm cách xác định vị trí địa lý thật của 1 thiết bị - trong trường hợp này là điện thoại smartphone mà ta sử dụng.cách thông thường nhất để xác định vị trí địa lý của 1 thiết bị là sử dụng tính năng GPS chứa bên trong smartphone – dùng để xác định kinh độ và vĩ độ
Tuy nhiên, 1 vài thiết bị có thể sử dụng những dịch vụ khác để suy luận ra 1 ví trí – ví dụ như : 1 địa chỉ IP, xác định tần số radio (RFID), địa chỉ truy cập wifi (MAC), hay trạm phát sóng.bởi vì có rất nhiều phương thức khác nhau được sử dụng để thu thập các tọa độ ví trí, do vậy khơng ai có thể đảm bảo rằng phonegap API sẽ trả về vị trí thật sự của thiết bị
4.2.Cách sử dụng Geolocation
Lí do hiển nhiên nhất để sử dụng Geolocation gần đây là xu hướng dùng để xác định nơi mà có 1 vài thứ xảy ra.ví dụ như dữ liệu Geolocation được thêm vào các bức ảnh hay trên các mạng xã hội, …
Tuy nhiên các ứng dụng Geolocation chử yếu chỉ rõ các vị trí ở thế giới thật ( giống như nhà hàng, quán bar, …) và kết hợp chúng với thiết bị trên tay người sử dụng
Theo đó có 3 cách sáng tạo mà ta có thể thêm dữ liệu geolocation vào bất cứ ứng dụng nào :
Không chỉ thêm kinh độ và vĩ độ mà còn thêm vào tiêu đề và độ cao vào các bức ảnh Cho phép người dùng tích vào bất cứ tọa độ do đó họ có thể lưu giữ được dấu vết
quãng đường mình đã đi
4.3.Các mẫu ứng dụng về Geolocation
Các ứng dụng về Geolocation nổi tiếng là “foursquare” (hình 8-1) và “Gowalla” (hình 8-2).cả 2 ứng dụng đều là miễn phí và tương thích với các nền tảng thiết bị khác nhau.ta có thể đăng ký và bắt đầu sử dụng chúng.nếu ta đang ở trong 1 nhà hàng ăn hay 1 qn bar thì ta có thể sử dụng chúng để tích vào và sử dụng facebook hay twitter để thơng báo cho bạn bè biết nơi ta đang có mặt
Ngơ Quang Trung – email: ngotrung.poli.t@gmail.com / www.phonegap.vn/forum 43
Cả 2 ứng dụng “Gowalla” và “foursquare” đều hướng tới mỗi trường mạng xã hội – những