Written by Pham Nguyen

Phát triển ứng dụng Html5 trong Windows Phone 7, 8 với PhoneGap hay Cordova

I.Introduction

PhoneGap chắc chắn là khái niệm khá quen thuộc đối với các Web Developer muốn phát triển Web App trên Mobile.

Hôm nay mình xin chia sẻ cách để phát triển ứng dụng Html5 với PhoneGap.

II. Fundamental

Trước tiên chúng ta phải download gói PhoneGap từ Github về : https://github.com/phonegap/phonegap/zipball/1.7.0

Sau khi download giải nến thư mục và vào lib folder.

image

sau đó tìm thư mục Windows

image

Vào thư mục Windows và copy file CoroDovaStarter vào thư mục C:\Users\username\Documents\Visual Studio 2012\Templates\ProjectTemplates\Visual C#\Windows Phone 

 

Các bạn lưu ý là nếu trong ProjectTemplates ko có thư mục Windows Phone thì chúng ta có thể tự tạo nhé.

Và bây giờ chúng ta có thể mở Visual Studio 2012 để tạo Project Cordova rồi.

image

Sau khi tạo Project xong thì cấu trúc ứng dụng chúng ta thế này

image

Chúng ta quản lý các File Html trong thư mục www nhé.  bây giờ chúng ta có thể vào file index.html để phát triển theo ý chúng ta nhé, 

<body>

    <h1>Phạm Nguyên</h1>

    <div id="welcomeMsg"></div>

</body>

Một điểm cần lưu ý là tất cả các script sẽ chạy khi device ready. Chúng ta có thể xử lý script trong sự kiện này nhé 

<script type="text/javascript">
   1:  




   2:       document.addEventListener("deviceready",onDeviceReady,false);




   3:  




   4:       // once the device ready event fires, you can safely do your thing! -jm




   5:       function onDeviceReady()




   6:       {




   7:           document.getElementById("welcomeMsg").innerHTML += "Hello ! this my first Cordova/PhoneGap Applicatoin";




   8:           console.log("onDeviceReady. You should see this message in Visual Studio's output window.");




   9:  




  10:       }




  11:  




  12:     


</script>

và kết quả sẽ là :

image

Vậy là thật đơn giản chúng tra đã cài đặt và tạo được ứng dụng PhoneGap/Cordova rồi nhé.

 

Hy vọng bài viết này sẽ hữu ích với các bạn

Leave a comment