博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
PhoneGap与Jquery Mobile结合开发android应用配置
阅读量:5278 次
发布时间:2019-06-14

本文共 2875 字,大约阅读时间需要 9 分钟。

由于工作需要,用到phonegap与jquery moblie搭配,开发android应用程序。

这些技术自己之前也都没接触过,可以说是压根没听说过,真是感慨,在开发领域,技术日新月异,知识真是永远学不完的。就算是做java 开发的,可是细分下来,专业方向还是很多的;自己没有涉及的技术还是太多了,自个需要对单个领域专业点,知识丰富点。做不了全才,那咱做个专才,在如今社 会还是必须的。

好了,咱们言归正传:

PhoneGap是一个开源的开发框架,使用HTML,CSS和JavaScript来构建跨平台的的移动应用程序。它使开发者能够利 用iPhone,Android,Palm,Symbian,Blackberry,Windows Phone和Beda智能手机的核心功能——包括地理定位,加速器,联系人,声音和振动等。

Jquery mobile是由(MT)Media Temple联合多家移动设备厂商以及软件企业共同发起的的针对触屏智能手机与平板电脑的website以及在线应用的前端开发框架。Jquery mobile构建于Jquery 以及 Jquery UI类库之上,为前端开发人员提供了一个兼容所有主流移动设备平台的统一UI接口系统。拥有出色的弹性,轻量化以及渐进增强特性与可访问性。

 

1.首先需要下载PhoneGap,可以去如下网站下载:http://phonegap.com/   在首页的右上角有个下载图标,点击可以下载其压缩版本,现在最新版是PhoneGap1.5.0,下载后的文件名是:phonegap-phonegap-1[1].5.0-0-gde1960d.zip。

2.下载完成后,对其进行解压,里面会有其介绍文档和示例文件(包括android,ios,blackberry等),此处我们只需 要用到android的,在解压的文件中,在lib文件夹下的android文件夹中,我们找到cordova-1.5.0.jar(其实也就是其他网站 中指的phonegap.jar)、cordova-1.5.0.js还有一个xml文件夹

3.新建一个android工程

4.在项目的根目录下新建四个目录。 /libs /assets/www

/assets/css

/assets/js

5.将cordova-1.5.0.js拷贝到/assets/js目录下。 6.将cordova-1.5.0.jar拷贝到/libs目录下。 7.将xml文件夹拷贝到/res目录下。 8.在src源代码文件中的main java源代码文件中做做一些修改。 将类由继承Activity改成继承DroidGap。 将setContentView()一行用super.loadUrl("file:///android_asset/www/index.html");替换 添加: import com.phonegap.*; 删除import android.app.Activity

import org.apache.cordova.DroidGap;import android.os.Bundle;public class App extends DroidGap {    /** Called when the activity is first created. */    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);//        setContentView(R.layout.main);        super.loadUrl("file:///android_asset/www/index.html");    }}

布置好的项目截取如下:

此时你还没有jquery mobile没有关系。我们先把phonegap配置好,接着:

 1.在AndroidManifest.xml中添加如下xml代码,具体添加地方,可以参考上面的截图:

2.将如下 android:configChanges="orientation|keyboardHidden"添加到默认的activity标签中。

 

 3.然后在/assets/www/目录下创建一个index.html文档内容如下:

      PhoneGap        

Hello World

4.加入jquery mobile支持,去其官网下载:http://jquerymobile.com/blog/2012/01/26/jquery-mobile-1-0-1-released/#download,

现在最新稳定版本是1.0.1,可以下载包含所需文件的zip格式的压缩包,名称: jquery.mobile-1.0.1.zip (JavaScript, CSS, and images) ,另外再下载jquery-1.6.4.min.js

下载下来后,解压。把jquery.mobile-1.0.1.min.css放到assets/css目录下,把jquery.mobile-1.0.1.min.js和jquery-1.6.4.min.js放到assets/js目录下。

5.修改index.html

     

Test

Page Footer

Dialog Title

This is a dialog box

Additional Footer information

运行结果如下:

 

转:

转载于:https://www.cnblogs.com/huidaoli/p/3549794.html

你可能感兴趣的文章
JS中实现字符串和数组的相互转化
查看>>
web service和ejb的区别
查看>>
Windows Azure Cloud Service (29) 在Windows Azure发送邮件(下)
查看>>
CS61A Efficiency 笔记
查看>>
微信上传素材返回 '{"errcode":41005,"errmsg":"media data missing"}',php5.6返回
查看>>
div或者p标签单行和多行超出显示省略号
查看>>
Elasticsearch 滚动重启 必读
查看>>
Hadoop基本概念
查看>>
java.util.zip压缩打包文件总结一:压缩文件及文件下面的文件夹
查看>>
浅说 apache setenvif_module模块
查看>>
MySQL--数据插入
查看>>
重新学习python系列(二)? WTF?
查看>>
shell脚本统计文件中单词的个数
查看>>
SPCE061A学习笔记
查看>>
sql 函数
查看>>
hdu 2807 The Shortest Path 矩阵
查看>>
熟悉项目需求,要知道产品增删修改了哪些内容,才会更快更准确的在该项目入手。...
查看>>
JavaScript 变量
查看>>
java实用类
查看>>
smarty模板自定义变量
查看>>