phonegap 开发入门

最新推荐文章于 2017-10-18 16:20:55 发布
最新推荐文章于 2017-10-18 16:20:55 发布
阅读量277 收藏 1
点赞数
文章标签： 开发工具 java javascript ViewUI
原文链接：http://www.cnblogs.com/santry/archive/2011/12/19/2293278.html
版权

PhoneGap官方网站上有详细的入门示例教程，这里，我针对使用PhoneGap进行Android移动应用的开发对其官网的Get Started进行一些介绍、补充。

Step1、选择你想要进行开发的移动平台，点击Android图标

Step2、需要安装的软件-Eclipse3.4以上版本

Step3、安装SDK+PhoneGap

(1)安装Eclipse3.4，我安装使用的为3.6版本中文语言包(如果你使用的是英文原版，下面的一些操作请自行和我的中文描述对应)，ADT Plugin要求使用3.5.1以上版本 。如果你对Eclipse不了解，不知道使用哪种版本的，建议下载Eclipse Classic版本。Eclipse为绿色版软件，下载后解压到任意位置均可使用。

(2)下载安装JDK (java SDK)。android SDK 依赖于JDK，所以必须先安装JDK 。JDK1.6官方下载 。JDK 安装好以后，需要配置系统环境变量。配置系统环境变量.

(3)下载安装Android SDK (android官方下载地址不可直接访问，华军有当前最新版本的SDK下载，访问这里)。同JDK设置环境变量一样，需要设置ADK的环境变量为(以我安装ADK的路径为例) M:\Program Files\Android\android-sdk\platform-tools

(4)下载安装 ADT Plugin 是一款Eclipse的插件，用于快速开发Android应用。

(5)下载最新版本的PhoneGap

以上所有都安装好以后，再进行下一步

Step4

◆打开Eclipse，选择文件->新建->其他->Android Project

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

Application name：helloinside

Package name：com.phonegap.helloinside

Create Activity：app

打开Eclipse

这一步如果遇到No target available ，是因为ADK环境没配置好 首选项—>android—>选择android-sdk的路径，然后点击应用即可。(需要重新启动Eclipse)

注：目前PhoneGap 0.9.3用Android 2.3以上版本会出错，所以Build Target请选 Android 2.2以下的版本。

◆在新建项目的根目录下，创建两个目录

  1. /libs
  2. /assets/www

◆解压PhoneGap文件夹，复制phonegap.js文件到/assets/www 目录下，复制phonegap.jar文件到libs目录下

◆需要对Eclipse下项目的App.java文件(src文件夹内)进行一些配置(如图所示)

修改类的继承 将Activity 修改为 DroidGap

将setContentView() 这一行修改为super.loadUrl("file:///android_asset/www/index.html");

添加 import com.phonegap.*;

有可能在这里会遇到一个错误，显示Eclipse找不到phonegap-0.9.2.jar ，右键点击/libs文件夹，Build Paths(构建路径)/ > Configure Build Paths(配置构建路径) 在library(库)栏向工程中添加phonegap-0.9.4.jar ，可能需要按一次F5刷新。

◆右键点击AndroidManifest.xml文件，选择Open With > Text Editor(打开方式->文本编辑器)

如图所示

◆粘贴下面的授权信息至版本名称后面(如图所示)

  1. <supports-screens
  2. android:largeScreens="true"
  3. android:normalScreens="true"
  4. android:smallScreens="true"
  5. android:resizeable="true"
  6. android:anyDensity="true"
  7. />
  8. <uses-permissionandroid:name="android.permission.CAMERA"/>
  9. <uses-permissionandroid:name="android.permission.VIBRATE"/>
  10. <uses-permissionandroid:name="android.permission.ACCESS_COARSE_LOCATION"/>
  11. <uses-permissionandroid:name="android.permission.ACCESS_FINE_LOCATION"/>
  12. <uses-permissionandroid:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS"/>
  13. <uses-permissionandroid:name="android.permission.READ_PHONE_STATE"/>
  14. <uses-permissionandroid:name="android.permission.INTERNET"/>
  15. <uses-permissionandroid:name="android.permission.RECEIVE_SMS"/>
  16. <uses-permissionandroid:name="android.permission.RECORD_AUDIO"/>
  17. <uses-permissionandroid:name="android.permission.MODIFY_AUDIO_SETTINGS"/>
  18. <uses-permissionandroid:name="android.permission.READ_CONTACTS"/>
  19. <uses-permissionandroid:name="android.permission.WRITE_CONTACTS"/>
  20. <uses-permissionandroid:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
  21. <uses-permissionandroid:name="android.permission.ACCESS_NETWORK_STATE"/>

如上图所示

◆向activity标记中添加android:configChanges="orientation|keyboardHidden” (如上图所示)

Step5

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

◆粘贴下面的代码至index.html文件中

  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <title>PhoneGap</title>
  5. <scripttype="text/javascript"charset="utf-8"src="phonegap.js"></script>
  6. </head>
  7. <body>
  8. <h1>Hello World!</h1>
  9. </body>
  10. </html>

Step6

◆右键点击项目，选择 运行方式-> Android Application

◆Eclipse可能会询问你选择一个AVD(Android运行的虚拟设备)，如果没有，你可以创建一个(建议选择2.2版本)

注意：运行时初始启动较慢，需要耐心等待几分钟。

如果你看到了下面这张图，恭喜你，hello world运行成功!

hello world

Step7

◆确保你的设备上开启了USB debug模式，并且通过USB线将它连接到电脑上(你的设备：设置->应用->开发)

◆右键点击项目，选择 运行方式-> Android Application

OK ! 如果不出意外的话，你的第一个Android版应用 Hello World!就已经大功告成了。接下来，你可以参阅PhoneGap wiki 学习更多的应用开发知识。

reference:http://www.phonegap.com/start#android

原文教学影片：http://www.youtube.com/watch?v=MzcIcyBYJMA

【编辑推荐】

转载于:https://www.cnblogs.com/santry/archive/2011/12/19/2293278.html

adxj46627377
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
phonegap安装 环境搭建与配置详解( 完整版 提供下载地址)
m0_61369523的博客
03-17 904
其实Android开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。下图是我进阶学习所积累的历年腾讯、头条、阿里、美团、字节跳动等公司2019-2021年的高频面试题，博主还把这些技术点整理成了视频和PDF（实际上比预期多花了不少精力），包含知识脉络 + 诸多细节以上【历年大厂高级工程师面试题集】、【Android高级进阶教学视频】、【Android高级知识点学习PDF】皆无偿分享给大家。
跨平台开发技术-PhoneGap从入门到精通3
04-16
跨平台开发技术-PhoneGap从入门到精通(PhoneGap、罗盘、运动传感器、地理位置
PhoneGap安装和使用教程
冰凉的枷锁的博客
10-18 8833
一、使用PhoneGap软件创建工程 参考官方网站：http://docs.phonegap.com/getting-started/1-install-phonegap/desktop/ 1.下载安装PhoneGap Mac版 2.下载安装PhoneGap iPhone版 3.创建项目： 打开Mac上的phonegap应用，单击加号，然后选择创建新的PhoneGap项目，填写项目信息 ...
phonegap入门实战
weixin_33916256的博客
11-13 105
2019独角兽企业重金招聘Python工程师标准>>> ...
phonegap 安装及环境配置（简介）
webxiaoma
12-04 1549
最近在弄ionic ，需要安装phonegap，下面来说一下phonegap怎么安装以及配置 这里主要讲的是window的安装 一、PhoneGap简介 PhoneGap是一个用基于HTML，CSS和JavaScript的，创建移动跨平台移动应用程序的快速开发平台。它使开发者能够利用 iPhone，Android，Palm，Symbian,WP7,Bada和Blackberry智能手
phonegap介绍
Delion
06-01 1313
一、PhoneGap是什么？ PhoneGap是一个标准的开源框架，用PhoneGap开发移动应用是免费的，无论是商业或是开源；一个用基于HTML，CSS和JavaScript的，创建跨平台移动应用的快速开发平台。它使开发者能够利用iPhone、Android、Palm、Symbian、WP7、Bada和Blackberry智能手机的核心功能——包括地理定位，加速器，联系人，声音和振动等，此
PhoneGap开发入门借鉴.pdf
02-12
这个教程是针对初学者的PhoneGap开发指南，重点介绍了如何在Eclipse环境中配置和设置PhoneGap项目。 首先，开发者需要确保他们拥有合适的开发环境。Eclipse 3.4或更高版本是必要的，因为它是Android开发的主要集成...
PhoneGap入门经典
02-03
在简要介绍了PhoneGap的安装和配置信息之后，《PhoneGap入门经典》将迅速引导你使用PhoneGap建立iOS、Android以及BlackBerry应用程序。每一章都对不同的组件提供了深度的视角，并在进入下一阶段前通过练习使你掌握每...
PhoneGap开发快速入门
12-10
PhoneGap开发快速入门，完美的入门指南，欢迎下载
跨平台开发技术-PhoneGap从入门到精通4
04-16
跨平台开发技术-PhoneGap从入门到精通(PhoneGap、罗盘、运动传感器、地理位置
PhoneGap安装及使用教程
09-11
PhoneGap是一个用基于HTML，CSS和JavaScript的，创建移动跨平台移动应用程序的快速开发平台。它使开发者能够利用iPhone，Android，Palm，Symbian,WP7,Bada和Blackberry智能手机的核心功能——包括地理定位，加速器，联系人，声音和振动等，此外PhoneGap拥有丰富的插件，可以以此扩展无限的功能。PhoneGap是免费的，但是它需要特定平台提供的附加软件，例如iPhone的iPhone SDK，Android的Android SDK等，也可以和DW5.5配套开发。使用PhoneGap只比为每个平台分别建立应用程序好一点点，因为虽然基本代码是一样的，但是你仍然需要为每个平台分别编译应用程序。
手机/开发工具/PhoneGapSetup
08-06
手机/开发工具/PhoneGapSetup无需安装环境，执行EXE文件即可查看手机端的程序
phonegap-splashscreen
04-13
NULL 博文链接：https://fanfq.iteye.com/blog/1714451
PhoneGapDeveloperApp.zip
07-19
PhoneGap Developer app 是一个为 Web 开发者和设计者提供的测试工具，使用 PhoneGap 框架。安装后可连接到你的 PhoneGap 桌面到一个即时视图并在设备上进行测试。相当于是在移动设备上调试 PhoneGap 应用的工具，不需要每次打包、安装就可以直接在手机上调试 PhoneGap 应用。 标签：PhoneGap
phonegap桌面开发工具
07-08
phonegap桌面开发工具 Phonegap Desktop-App与 手机客户端工具PhoneGap Developer App.pdf
跨平台开发：初探PhoneGap移动开发框架
03-16 6655
随着Google的Android手机和苹果的iPhone手机的逐渐普及，越来越多开发者加入到移动应用开发的大军当中。目前移动终端中的冠亚军Android，应用是基于Java语言基础上进行开发的；而苹果公司的iPhone则是基于C语言开发的。如果开发者编写的应用需要同时在不同的移动设备上运行的话，则必须要掌握多种开发语言，这已经成为开发团队的一大难题，在51CTO专访国内著名移动软件尚邮的首席架构师
HTML5移动端混合应用开发项目案例实战视频
04-09
课程介绍：课程包含Canvas、video视频案例、swiper案例、混合开发结合MUI框架等结合讲解。
PhoneGap是什么?
897371388
11-21 228
PhoneGap是目前唯一支持7种平台的开源移动开发框架，支持的平台包括iOS、Android、BlackBerry OS、Palm WebOS、Windows Phone 7、Symbian和Bada，如图1-2所示。 PhoneGap是一个基于HTML、CSS和JavaScript创建跨平台移动应用程序的快速开发平台。与传统Web应用不同的是，它使开发者能够利用iPhone、Andr...
Phonegap(Cordova)3.4 + Android 环境搭建
热门推荐
莫等闲的专栏
05-12 1万+
PhoneGap是一个用基于HTML，CSS和JavaScript的，创建移动跨平台移动应用程序的快速开发平台。自2.9.0以后，不提供直接下载，需要用node.js来安装。网络上有很多其开发环境配置的文章，感觉都不是那么很好用。结合网络上的知识，自己摸索了一种Phonegap(Cordova)3.4的Android环境搭建方式，整理如下。
前端混合式开发app
最新发布
08-30
前端混合式开发app是一种通过前端技术来构建移动应用程序的方法。它结合了原生应用程序和Web应用程序的特点，既可以使用Web技术来开发应用程序的界面和功能，又能够利用原生应用程序的优势提供更好的用户体验。 前端混合式开发app通常使用一种称为混合App开发框架的工具进行开发。这些框架允许开发人员使用HTML、CSS和JavaScript等Web技术来构建应用程序的用户界面和逻辑，再将这些Web内容封装在一个原生应用程序的容器中，以实现在移动设备上的运行。 混合式开发app的一个重要特点是跨平台性。通过使用前端技术进行开发，可以实现在不同操作系统和设备上运行。开发人员只需编写一次代码，就可以将应用程序发布到多个平台上，大大减少了开发的工作量和成本。 在前端混合式开发app中，可以使用一些常见的开发框架，如Cordova（前身是PhoneGap）、React Native等。这些框架提供了丰富的API和插件，可以与设备的硬件和操作系统进行交互，例如访问相机、地理位置、通知等功能。 当然，前端混合式开发app也存在一些挑战和限制。由于应用程序运行在一个原生容器中，相对于原生应用程序来说，性能可能会稍有降低。另外，某些高级功能和特性可能无法完全实现，需要使用原生开发来完成。 总的来说，前端混合式开发app是一种灵活、高效、跨平台的开发方法，适用于许多场景。它结合了Web技术和原生应用程序的优势，为开发人员提供了更好的开发体验和用户体验。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值