phoneGap+android学习之搭建环境

最新推荐文章于 2021-05-30 19:38:19 发布

cainiao123hack

最新推荐文章于 2021-05-30 19:38:19 发布

阅读量1.5k

点赞数 1

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）创建

/libs #这个用于放cordova-1.5.0.jar

/assets/www #这个用于放cordova-1.5.0.js

点击项目右键属性->java build path->libraties-> add jars

把解压出来的android目录下的xml包放到/res下

cordova.xml:

点击(此处)折叠或打开

<?xmlversion="1.0"encoding="utf-8"?>
<cordova>
<access origin="http://127.0.0.1*"/>
<log level="DEBUG"/>
</cordova>

我猜acess origin是phonegap的内部web服务器地址，log是定义日志级别

plugins.xml：

点击(此处)折叠或打开

<?xmlversion="1.0"encoding="utf-8"?>
<plugins>
<plugin name="App" value="org.apache.cordova.App"/>
<plugin name="Geolocation" value="org.apache.cordova.GeoBroker"/>
<plugin name="Device" value="org.apache.cordova.Device"/>
<plugin name="Accelerometer" value="org.apache.cordova.AccelListener"/>
<plugin name="Compass" value="org.apache.cordova.CompassListener"/>
<plugin name="Media" value="org.apache.cordova.AudioHandler"/>
<plugin name="Camera" value="org.apache.cordova.CameraLauncher"/>
<plugin name="Contacts" value="org.apache.cordova.ContactManager"/>
<plugin name="File" value="org.apache.cordova.FileUtils"/>
<plugin name="Network Status" value="org.apache.cordova.NetworkManager"/>
<plugin name="Notification" value="org.apache.cordova.Notification"/>
<plugin name="Storage" value="org.apache.cordova.Storage"/>
<plugin name="Temperature" value="org.apache.cordova.TempListener"/>
<plugin name="FileTransfer" value="org.apache.cordova.FileTransfer"/>
<plugin name="Capture" value="org.apache.cordova.Capture"/>
<plugin name="Battery" value="org.apache.cordova.BatteryListener"/>
</plugins>

上面定义的是所加载的插件，加载的插件越多就需要在AndroidManifest.xml里定义响应的访问权限，若是不需要网络可以把响应的插件去掉

6.开始开发

可以参考自带的example

1）首先把activity类进行修改

点击(此处)折叠或打开

package com.yifangyou.hellophonegap;
import android.os.Bundle;
import org.apache.cordova.*;
public class HelloPhoneGapextends DroidGap {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
//加载assets/www目录下的的index.html
super.loadUrl("file:///android_asset/www/index.html");
}
}

2)创建index.html

编辑assets/www/index.html

点击(此处)折叠或打开

<!DOCTYPE HTML>
<head>
<title>你好 PhoneGap</title>
<script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
</head>
<body>
<h1>你好 PhoneGap</h1>
</body>
</html>

3)修改AndroidManifest.xml,增加权限设置

点击(此处)折叠或打开

<?xmlversion="1.0"encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:windowSoftInputMode="adjustPan"
package="com.yifangyou.hellophonegap" android:versionName="1.1" android:versionCode="5">
<uses-sdk android:minSdkVersion="8"/>
<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.INTERNET"/>
<uses-permission android:name="android.permission.RECEIVE_SMS"/>
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.RECORD_VIDEO"/>
<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"/>
<uses-permission android:name="android.permission.GET_ACCOUNTS"/>
<uses-permission android:name="android.permission.BROADCAST_STICKY"/>
<uses-feature android:name="android.hardware.camera"/>
<uses-feature android:name="android.hardware.camera.autofocus"/>
<application android:icon="@drawable/icon" android:label="@string/app_name"
android:debuggable="true">
<activity android:name=".HelloPhoneGap" android:label="@string/app_name"
android:configChanges="orientation|keyboardHidden">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
<activity android:name="org.apache.cordova.DroidGap" android:label="@string/app_name"
android:configChanges="orientation|keyboardHidden">
<intent-filter>
</intent-filter>
</activity>
</application>
</manifest>

7.运行

1）创建设备

点击创建设备按钮

屏幕小的电脑，可以选择400屏幕的

2)运行

点击项目右键run as -> run configuration

选择新创建的设备

运行效果

中文乱码，估计是html没有设置语言的问题或者是index.html的编码问题

改了一下文件编码

把index.html改为

点击(此处)折叠或打开

<!DOCTYPEHTML lang="zh-CN">
<head>
<title>你好 PhoneGap</title>
<meta http-equiv="Content-Type"content="text/html; charset=utf-8">
<script type="text/javascript"charset="utf-8"src="cordova-1.5.0.js"></script>
</head>
<body>
<h1>你好 PhoneGap</h1>
</body>
</html>

运行后

ok!

cainiao123hack

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
phoneGap+android学习之搭建环境

PhoneGap是一个开发跨平台的html5本地化程序的平台，通过它可以把网页变为各种平台上的应用程序1.下载phoneGap到官网下载：http://phonegap.com/我下载的版本是1.52.浏览在下载完的zip包在包中我找到android的lib，我用android也是迫于没有苹果机3.我在系统里已经安装好了eclipse3.6和android3.1
复制链接

扫一扫