Install
To Install 3.3: Ensure that you have NodeJS installed, then open your commandline and run the following:
C:\> npm install -g phonegap
Once installation completes, you can invoke phonegap
on command line for further help.
Usage
$ phonegap create my-app
$ cd my-app
$ phonegap run android
Learn more at docs.phonegap.com
PhoneGap是一个开发跨平台的html5本地化程序的平台,通过它可以把网页变为各种平台上的应用程序
1.下载phoneGap
到官网下载: http://phonegap.com/
我下载的版本是1.5
2.浏览在下载完的zip包
在包中我找到android的lib,我用android也是迫于没有苹果机
3.我在系统里已经安装好了eclipse3.6和android3.1
4.新建工程
在eclipse里新建工程
下一步
创建的android项目版本可以是更低一些我看了一下它自带的例子是5
点击finish
5.加入phoneGap包
1)创建
#这个用于放cordova-1.5.0.jar
#这个用于放cordova-1.5.0.js
点击项目右键属性->java build path->libraties-> add jars
把解压出来的android目录下的xml包放到/res下
cordova.xml:
点击(此处)折叠或打开
1. <</span>?xml version="1.0" encoding="utf-8"?>
2. <</span>cordova>
3. <</span>access origin="http://127.0.0.1*"/>
4. <</span>log level="DEBUG"/>
5. <</span>/cordova>
plugins.xml:
点击(此处)折叠或打开
1. <</span>?xml version="1.0" encoding="utf-8"?>
2. <</span>plugins>
3. <</span>plugin name="App" value="org.apache.cordova.App"/>
4. <</span>plugin name="Geolocation" value="org.apache.cordova.GeoBroker"/>
5. <</span>plugin name="Device" value="org.apache.cordova.Device"/>
6. <</span>plugin name="Accelerometer" value="org.apache.cordova.AccelListener"/>
7. <</span>plugin name="Compass" value="org.apache.cordova.CompassListener"/>
8. <</span>plugin name="Media" value="org.apache.cordova.AudioHandler"/>
9. <</span>plugin name="Camera" value="org.apache.cordova.CameraLauncher"/>
10. <</span>plugin name="Contacts" value="org.apache.cordova.ContactManager"/>
11. <</span>plugin name="File" value="org.apache.cordova.FileUtils"/>
12. <</span>plugin name="Network Status" value="org.apache.cordova.NetworkManager"/>
13. <</span>plugin name="Notification" value="org.apache.cordova.Notification"/>
14. <</span>plugin name="Storage" value="org.apache.cordova.Storage"/>
15. <</span>plugin name="Temperature" value="org.apache.cordova.TempListener"/>
16. <</span>plugin name="FileTransfer" value="org.apache.cordova.FileTransfer"/>
17. <</span>plugin name="Capture" value="org.apache.cordova.Capture"/>
18. <</span>plugin name="Battery" value="org.apache.cordova.BatteryListener"/>
19. <</span>/plugins>
6.开始开发
可以参考自带的example
1)首先把activity类进行修改
点击(此处)折叠或打开
1. package com.yifangyou.hellophonegap;
2.
3. import android.os.Bundle;
4. import org.apache.cordova.*;
5. public class HelloPhoneGap extends DroidGap {
6.
7. @Override
8. public void onCreate(Bundle savedInstanceState)
9. {
10. super.onCreate(savedInstanceState);
11. //加载assets/www目录下的的index.html
12. super.loadUrl("file:///android_asset/www/index.html");
13. }
14. }
编辑assets/www/index.html
点击(此处)折叠或打开
你好 PhoneGap
点击(此处)折叠或打开
1. <</span>?xml version="1.0" encoding="utf-8"?>
2. <</span>manifest xmlns:android="http://schemas.android.com/apk/res/android" android:windowSoftInputMode="adjustPan"
3. package="com.yifangyou.hellophonegap" android:versionName="1.1" android:versionCode="5">
4. <</span>uses-sdk android:minSdkVersion="8" />
5. <</span>supports-screens
6. android:largeScreens="true"
7. android:normalScreens="true"
8. android:smallScreens="true"
9. android:resizeable="true"
10. android:anyDensity="true"
11. />
12.
13. <</span>uses-permission android:name="android.permission.CAMERA" />
14. <</span>uses-permission android:name="android.permission.VIBRATE" />
15. <</span>uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
16. <</span>uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
17. <</span>uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
18. <</span>uses-permission android:name="android.permission.INTERNET" />
19. <</span>uses-permission android:name="android.permission.RECEIVE_SMS" />
20. <</span>uses-permission android:name="android.permission.RECORD_AUDIO" />
21. <</span>uses-permission android:name="android.permission.RECORD_VIDEO"/>
22. <</span>uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
23. <</span>uses-permission android:name="android.permission.READ_CONTACTS" />
24. <</span>uses-permission android:name="android.permission.WRITE_CONTACTS" />
25. <</span>uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
26. <</span>uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
27. <</span>uses-permission android:name="android.permission.GET_ACCOUNTS" />
28. <</span>uses-permission android:name="android.permission.BROADCAST_STICKY" />
29.
30. <</span>uses-feature android:name="android.hardware.camera" />
31. <</span>uses-feature android:name="android.hardware.camera.autofocus" />
32. <</span>application android:icon="@drawable/icon" android:label="@string/app_name"
33. android:debuggable="true">
34. <</span>activity android:name=".HelloPhoneGap" android:label="@string/app_name"
35. android:configChanges="orientation|keyboardHidden">
36. <</span>intent-filter>
37. <</span>action android:name="android.intent.action.MAIN" />
38. <</span>category android:name="android.intent.category.LAUNCHER" />
39. <</span>/intent-filter>
40. <</span>/activity>
41. <</span>activity android:name="org.apache.cordova.DroidGap" android:label="@string/app_name"
42. android:configChanges="orientation|keyboardHidden">
43. <</span>intent-filter>
44. <</span>/intent-filter>
45. <</span>/activity>
46. <</span>/application>
47. <</span>/manifest>
1)创建设备
点击创建设备按钮
屏幕小的电脑,可以选择400屏幕的
2)运行
点击项目右键run as -> run configuration
选择新创建的设备
运行效果
中文乱码,估计是html没有设置语言的问题或者是index.html的编码问题
改了一下文件编码
把index.html改为
点击(此处)折叠或打开
1. <</span>!DOCTYPE HTML lang="zh-CN">
2. <</span>head>
3. <</span>title>你好 PhoneGap<</span>/title>
4. <</span>meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5. <</span>script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"><</span>/script>
6. <</span>/head>
7. <</span>body>
8. <</span>h1>你好 PhoneGap<</span>/h1>
9. <</span>/body>
10. <</span>/html>
正常啦
环境搭好了
今天到这里了,下次继续