~ Using apache cordova to build native android apps ~

   

Apache cordova 前身係phonega, 用來將HTML5 + jQuery web apps 變成native apps 用的

本文將記錄如何setting 及製作native android apps

[1]initiation

[1]ADT bundle for windows

先到http://developer.android.com/sdk/index.html

ADT bundle for windows or MAC, 已經包括了Eclipse 同android sdk , download 爆開佢就完成。

double Click 就可以用。

[2]apache cordova

是次主角, 先到http://phonegap.com/download/ ，下載後爆開佢備用

[2]Create project

-入到Eclipse , create new porject, FIle>new Android Application Project

-Application Name 最好upper case

-Next

-Next

-Next

-Next

-Finish

[3]Copy File to the Project

去返之前爆開個file 個folder , phonegap-2.3.0\lib\android

1. 將cordova-2.3.0.jar 抄去eclipse project 既/libs 內
2. Create a new folder in eclipse project 的assets，named "www",  再將cordova-2.3.0.js 抄去eclipse project 既/assets/www 內

-之後右Click /libs/cordova-2.3.0.jar , 將這個library 加入去尼個project 到 Build Path>Add to Buld Path

-之後將所有webapps file 抄去 assets/www 內，注意不可以有server side script(php/asp/jsp) , 只support js , html

[4]Edit src/MainActivity

1. 先加入此句 import org.apache.cordova.DroidGap;
2. 刪除這句import android.app.Activity;
3. public class MainActivity extends Activity { 改成 public class MainActivity extends DroidGap {
4. protected void onCreate(Bundle savedInstanceState) { 改成 public void onCreate(Bundle savedInstanceState) {
5. setContentView(R.layout.activity_main); 改成 super.loadUrl("file:///android_asset/www/examples/01-default.html");

This is before

This is After

 

-通常會係super.loadUrl("fileL///android_asset/www/index.html")

[5]edit rights for apps

最後修改apps之權限

-到eclipse project 既androidManifest.xml 右click >open with > text editor

[A]搵以下的code

android:versionCode="1"
android:versionName="1.0" >

加入以下的code

<supports-screens
android:largeScreens="true"
android:normalScreens="true"
android:smallScreens="true"
android:resizeable="true"
android:anyDensity="true"
/>
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

[B]再找以下的code

android:name="hk.connie.webapps.MainActivity"
android:label="@string/app_name" >

改成

android:name="hk.connie.webapps.MainActivity"
android:label="@string/app_name" 
android:configChanges="orientation|keyboardHidden">

完成