基于PhoneGap的Android應(yīng)用開(kāi)發(fā)：Get started

作者：支離破碎 2011-07-05 15:26:23

本文為PhoneGap官方網(wǎng)站上有詳細(xì)的入門示例教程的中文翻譯，作者針對(duì)使用PhoneGap進(jìn)行Android移動(dòng)應(yīng)用的開(kāi)發(fā)對(duì)其官網(wǎng)的Get Started進(jìn)行一些介紹、補(bǔ)充。

PhoneGap官方網(wǎng)站上有詳細(xì)的入門示例教程，這里，我針對(duì)使用PhoneGap進(jìn)行Android移動(dòng)應(yīng)用的開(kāi)發(fā)對(duì)其官網(wǎng)的Get Started進(jìn)行一些介紹、補(bǔ)充。

Step1、選擇你想要進(jìn)行開(kāi)發(fā)的移動(dòng)平臺(tái)，點(diǎn)擊Android圖標(biāo)

Step2、需要安裝的軟件-Eclipse3.4以上版本

Step3、安裝SDK+PhoneGap

(1)安裝Eclipse3.4，我安裝使用的為3.6版本中文語(yǔ)言包(如果你使用的是英文原版，下面的一些操作請(qǐng)自行和我的中文描述對(duì)應(yīng))，ADT Plugin要求使用3.5.1以上版本。如果你對(duì)Eclipse不了解，不知道使用哪種版本的，建議下載Eclipse Classic版本。Eclipse為綠色版軟件，下載后解壓到任意位置均可使用。

(2)下載安裝JDK (java SDK)。android SDK 依賴于JDK，所以必須先安裝JDK 。JDK1.6官方下載。JDK 安裝好以后，需要配置系統(tǒng)環(huán)境變量。配置系統(tǒng)環(huán)境變量.

(3)下載安裝Android SDK (android官方下載地址不可直接訪問(wèn)，華軍有當(dāng)前最新版本的SDK下載，訪問(wèn)這里)。同JDK設(shè)置環(huán)境變量一樣，需要設(shè)置ADK的環(huán)境變量為(以我安裝ADK的路徑為例) M:\Program Files\Android\android-sdk\platform-tools

(4)下載安裝 ADT Plugin 是一款Eclipse的插件，用于快速開(kāi)發(fā)Android應(yīng)用。

(5)下載最新版本的PhoneGap

以上所有都安裝好以后，再進(jìn)行下一步

Step4

◆打開(kāi)Eclipse，選擇文件->新建->其他->Android Project

并建立一個(gè)專案本文以 [helloinside]為名稱，分別輸入專案的屬性為

Application name：helloinside

Package name：com.phonegap.helloinside

Create Activity：app

打開(kāi)Eclipse

這一步如果遇到No target available ，是因?yàn)锳DK環(huán)境沒(méi)配置好首選項(xiàng)—>android—>選擇android-sdk的路徑，然后點(diǎn)擊應(yīng)用即可。(需要重新啟動(dòng)Eclipse)

注：目前PhoneGap 0.9.3用Android 2.3以上版本會(huì)出錯(cuò)，所以Build Target請(qǐng)選 Android 2.2以下的版本。

◆在新建項(xiàng)目的根目錄下，創(chuàng)建兩個(gè)目錄

/libs 
 
/assets/www

◆解壓PhoneGap文件夾，復(fù)制phonegap.js文件到/assets/www 目錄下，復(fù)制phonegap.jar文件到libs目錄下

◆需要對(duì)Eclipse下項(xiàng)目的App.java文件(src文件夾內(nèi))進(jìn)行一些配置(如圖所示)

修改類的繼承將Activity 修改為 DroidGap

將setContentView() 這一行修改為super.loadUrl("file:///android_asset/www/index.html");

添加 import com.phonegap.*;

有可能在這里會(huì)遇到一個(gè)錯(cuò)誤，顯示Eclipse找不到phonegap-0.9.2.jar ，右鍵點(diǎn)擊/libs文件夾，Build Paths(構(gòu)建路徑)/ > Configure Build Paths(配置構(gòu)建路徑) 在library(庫(kù))欄向工程中添加phonegap-0.9.4.jar ，可能需要按一次F5刷新。

◆右鍵點(diǎn)擊AndroidManifest.xml文件，選擇Open With > Text Editor(打開(kāi)方式->文本編輯器)

如圖所示

◆粘貼下面的授權(quán)信息至版本名稱后面(如圖所示)

<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" />

如上圖所示

◆向activity標(biāo)記中添加android:configChanges="orientation|keyboardHidden” (如上圖所示)

Step5

◆新建一個(gè)index.html文件至/assets/www目錄下

◆粘貼下面的代碼至index.html文件中

<!DOCTYPE HTML> 
<html> 
<head> 
<title>PhoneGap</title> 
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
</head> 
<body> 
<h1>Hello World!</h1> 
</body> 
</html>