PhoneGap基于html javascript开发Android程序


简介

一、PhoneGap是一款开源的手机应用开发平台,它仅仅只用HTML和JavaScript语言就可以制作出能在多个移动设备上运行的应用。
PhoneGap将移动设备本身提供的复杂的API进行了抽象和简化,提供了一系列丰富的API供开发者调用,
只要你会HTML和Javascript或者Java语言,就可以利用PhoneGap提供的API去调用各种功能,
制作出在各种手机平台上运行的应用。

鉴于我的一些体会,咱们刚开始使用新的技术就要细心点!所以下面的教程我会尽量详细的介绍给大家!

二、Android环境的配置我就不多说了!在我以前的教程中都有所体现!

下面我就开始吧:

1、下载最新版本的PhoneGap,我的是“phonegap-phonegap-1.0.0-0-g80cc6dd”版本的;
打开Eclipse,选择文件->新建->其他->Android Project


并建立一个专案本文以 [HelloPhoneGap]为名称,分别输入专案的属性为

Application name:HelloPhoneGap

Package name:com.phonegap.helloinside

Create Activity:app



2、在项目根目录下建立两个新文件夹:
/libs
/assets/www


•将下载的PhoneGap压缩包里的phonegap.js拷贝到/assets/www
•将下载的PhoneGap压缩包里的phonegap.jar拷贝到/libs
•将下载的PhoneGap压缩包里的xml文件夹拷贝到/res
•将工程里自动生成的那个java文件修改一下
◦将继承由 Activity 改为 DroidGap
◦删除 setContentView() 行,加入super.loadUrl(“file:///android_asset/www/index.html”);看清楚file:后面是三个/!
◦追加导入 import com.phonegap.*;
◦删除 import android.app.Activity;(真详细,不删也无所谓了)
改好以后就像这样:



3、修改 AndroidManifest.xml 增加需要的权限如下:
Html代码 复制代码  收藏代码
  1. <supports-screens android:largeScreens="true"  
  2. android:normalScreens="true" android:smallScreens="true"  
  3. android:resizeable="true" android:anyDensity="true" />  
  4. <uses-permission android:name="android.permission.CAMERA" />  
  5. <uses-permission android:name="android.permission.VIBRATE" />  
  6. <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />  
  7. <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />  
  8. <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />  
  9. <uses-permission android:name="android.permission.READ_PHONE_STATE" />  
  10. <uses-permission android:name="android.permission.INTERNET" />  
  11. <uses-permission android:name="android.permission.RECEIVE_SMS" />  
  12. <uses-permission android:name="android.permission.RECORD_AUDIO" />  
  13. <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />  
  14. <uses-permission android:name="android.permission.READ_CONTACTS" />  
  15. <uses-permission android:name="android.permission.WRITE_CONTACTS" />  
  16. <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />  
  17. <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />  
在 AndroidManifest.xml 中默认的那个Activiy里追加:

android:configChanges="orientation|keyboardHidden"

如下:
Java代码 复制代码  收藏代码
  1. <activity android:name="com.phonegap.DroidGap" android:label="@string/app_name" android:configChanges="orientation|keyboardHidden"> <intent-filter> </intent-filter> </activity>  
4、

新建一个index.html文件至/assets/www目录下

粘贴下面的代码至index.html文件中
Html代码 复制代码  收藏代码
  1. <!DOCTYPE HTML>    
  2. <html>    
  3. <head>    
  4. <title>PhoneGap</title>    
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js">  
  6. </script>    
  7. </head>    
  8. <body>  
  9.  <h1>Hello World!</h1>  
  10.  </body>  
  11.  </html>   

5、

右键点击项目,选择 运行方式-> Android Application
如果你看到了下面这张图,恭喜你,hello world运行成功!

Html代码 复制代码  收藏代码
  1. <supports-screens android:largeScreens="true"  
  2. android:normalScreens="true" android:smallScreens="true"  
  3. android:resizeable="true" android:anyDensity="true" />  
  4. <uses-permission android:name="android.permission.CAMERA" />  
  5. <uses-permission android:name="android.permission.VIBRATE" />  
  6. <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />  
  7. <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />  
  8. <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />  
  9. <uses-permission android:name="android.permission.READ_PHONE_STATE" />  
  10. <uses-permission android:name="android.permission.INTERNET" />  
  11. <uses-permission android:name="android.permission.RECEIVE_SMS" />  
  12. <uses-permission android:name="android.permission.RECORD_AUDIO" />  
  13. <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />  
  14. <uses-permission android:name="android.permission.READ_CONTACTS" />  
  15. <uses-permission android:name="android.permission.WRITE_CONTACTS" />  
  16. <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />  
  17. <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />  
在 AndroidManifest.xml 中默认的那个Activiy里追加:

android:configChanges="orientation|keyboardHidden"

如下:
Java代码 复制代码  收藏代码
  1. <activity android:name="com.phonegap.DroidGap" android:label="@string/app_name" android:configChanges="orientation|keyboardHidden"> <intent-filter> </intent-filter> </activity>  
4、

新建一个index.html文件至/assets/www目录下

粘贴下面的代码至index.html文件中
Html代码 复制代码  收藏代码
  1. <!DOCTYPE HTML>    
  2. <html>    
  3. <head>    
  4. <title>PhoneGap</title>    
  5. <script type="text/javascript" charset="utf-8" src="phonegap.js">  
  6. </script>    
  7. </head>    
  8. <body>  
  9.  <h1>Hello World!</h1>  
  10.  </body>  
  11.  </html>   

5、

右键点击项目,选择 运行方式-> Android Application
如果你看到了下面这张图,恭喜你,hello world运行成功!

猜你喜欢

转载自lishuaishuai.iteye.com/blog/1746659