phonegap 环境搭建教程(最新版本1.3)

环境搭建教程(最新版本1.3)

  • 视频教程:

    phonegap 环境搭建教程(最新版本1.3)
  • 1.配置要求

    • Eclipse 3.4+

    如果不想使用Eclipse,这里 提供了其他教程

  • 2.安装 SDK + PhoneGap

    phonegap 环境搭建教程(最新版本1.3)

    下载安装 Eclipse Classic

    phonegap 环境搭建教程(最新版本1.3)

    D下载安装 Android SDK

    phonegap 环境搭建教程(最新版本1.3)

    下载安装ADT Plugin

    phonegap 环境搭建教程(最新版本1.3)

    下载 最新的PhoneGap版本然后解压我们将会使用Android目录.

  • 3.设置新项目

    • 打开 Eclipse,在文件菜单下面点击 新建 > Android Project
    phonegap 环境搭建教程(最新版本1.3)
    • 在项目的根目录, 创建两个目录:
      • /libs
      • /assets/www
    • 从刚才下载的PhoneGap中复制phonegap.js 到/assets/www目录
    • 从刚才下载的PhoneGap中复制phonegap.jar 到/libs目录
    • 从刚才下载的PhoneGap中复制xml文到夹到/res 目录
    • 对Eclipse的src文件夹中的主Java文件进行少量调整:(如下图)
      • 将class的继承类由Activity 改为DroidGap
      • 将 setContentView() 这一行替换为super.loadUrl("file:///android_asset/www/index.html");
      • 添加 import com.phonegap.*;
      • 移除import android.app.Activity;
      phonegap 环境搭建教程(最新版本1.3)
    • 在这里你可能会遇到Eclipse找不到phonegap-1.0.0.jar的错误。在这种情况下,右键单击/libs文件夹找到Build Paths/ > Configure Build Paths。然后在Libraries标签页中添加phonegap-1.0.0.jar到项目中。如果Eclipse不是很稳定,你需要点击F5刷新一次项目。
    • 右键单击AndroidManifest.xml并选择 Open With > Text Editor
    • 将下面的权限设置拷贝到versionName之后:(如下图)
    <supports-screens <p>android:largeScreens="true"</p> <p>android:normalScreens="true"</p> <p>android:smallScreens="true"</p> <p>android:resizeable="true"</p> <p>android:anyDensity="true"</p> <p>/></p> <p><uses-permissionandroid:name="android.permission.CAMERA"/></p> <p><uses-permissionandroid:name="android.permission.VIBRATE"/></p> <p><uses-permissionandroid:name="android.permission.ACCESS_COARSE_LOCATION"/></p> <p><uses-permissionandroid:name="android.permission.ACCESS_FINE_LOCATION"/></p> <p><uses-permissionandroid:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS"/></p> <p><uses-permissionandroid:name="android.permission.READ_PHONE_STATE"/></p> <p><uses-permissionandroid:name="android.permission.INTERNET"/></p> <p><uses-permissionandroid:name="android.permission.RECEIVE_SMS"/></p> <p><uses-permissionandroid:name="android.permission.RECORD_AUDIO"/></p> <p><uses-permissionandroid:name="android.permission.MODIFY_AUDIO_SETTINGS"/></p> <p><uses-permissionandroid:name="android.permission.READ_CONTACTS"/></p> <p><uses-permissionandroid:name="android.permission.WRITE_CONTACTS"/></p> <p><uses-permissionandroid:name="android.permission.WRITE_EXTERNAL_STORAGE"/></p> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.GET_ACCOUNTS" />
  • 在AndroidManifest添加 android:configChanges="orientation|keyboardHidden" 到activity标签(见下图)
  • 在AndroidManifest添加第二个activity到 appliction 标签下面. (见下图)
<activity android:name="com.phonegap.DroidGap" android:label="@string/app_name" android:configChanges="orientation|keyboardHidden"> <intent-filter> </intent-filter> </activity>
phonegap 环境搭建教程(最新版本1.3)

4.hello word程序的编写

N在 “/assets/www”目录中新建文件index.html ,并粘贴如下代码:

<!DOCTYPE HTML> <p><html></p> <p><head></p> <p><title>PhoneGap</title></p> <p><scripttype="text/javascript"charset="utf-8"src="phonegap.js"></script></p> <p></head></p> <p><body></p> <p><h1>HelloWorld</h1></p> <p></body></p> <p></html></p> <p>
*phonegap.js 需要改为phonegap.<版本号>.js

5A. 加载到模拟器

  • 右键单击项目节点选择 Run As 然后点击Android Application
  • Eclipse将要求你选择一个合适的AVD(模拟器),如果没有设置的话,你需要创建一个AVD。

5B. 加载到设备

  • 确认设备已经勾选USB 调试选项,并已将设备连接到电脑。(设置 > 应用程序 > 开发)
  • 右键单击项目节点选择Run As 然后点击 Android Application

完成!

你可以在这里了解本指南的详细版本.

相关推荐