[Phonegap+Sencha Touch] 移动开发5、Sencha touch结合Phonegap使用

转载 2015年07月08日 17:16:05

敬告Sencha touch开发新手:
1、Sencha Touch项目(简称ST项目)、Phonegap项目、Android项目(或iOS项目)是三个不同的概念
2、ST项目和eclipse没关系;
Android项目和eclipse有点关系(可以用eclipse调试和导出apk包);
iOS项目和xcode有点关系(可以用xcode调试和上架)
3、ST项目用phonegap(或cordova)init之后,会出现给一个Phonegap目录,这个目录下是Phonegap项目
4、sencha app build native生成的Android项目(或iOS项目),在Phonegap目录下,是Phonegap项目的一部分

5、ST项目用sencha cmd也能生成原生安装包(如Android的APK),不过官方不再推荐用sencha cmd 生成原生安装包,而推荐用Phonegap,因为它可以使用各种原生插件实现特殊的功能(摄像头,定位,等等)

新手需要了解的内容:
开发环境搭建请看:《移动开发1、准备工作》
phonegap的初步使用,和sencha touch不搭嘎:《移动开发2、PhoneGap初步使用》

sencha touch的初步使用,和phonegap不搭嘎:《移动开发4、Sencha Touch初步使用》

进入正题,以下内容是Sencha touch结合Phonegap使用的标准步骤,
其他五花八门的开发方式容易出现各种各样的问题
附:英文原文
Leveraging PhoneGap within Sencha Touch

视频:下面是一个国外的视频教程,在Mac上使用Sencha touch+Phonegap开发ios的
Cordova_PhoneGap_with_Sencha_Cmd_4

下面作简要概括(以安卓为例,ios开发类似):
1、进入ST SDK
cd D:\Code\Web\touch-2.3.1

2、新建ST App
sencha generate app MyApp D:\Code\Android\sencha\MyApp

3、添加Phonegap支持
cd D:\Code\Android\sencha\MyApp
sencha phonegap init com.pushsoft.myapp MyApp

4、如果需要调用设备的功能,可以往项目中添加对应的phonegap插件。
如下我添加摄像头调用的插件
cd D:\Code\Android\sencha\MyApp\Phonegap
phonegap local plugin add http://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
然后js如下调用
navigator.camera.getPicture(function(){ 成功的回调方法 }, function(){ 失败的回调方法 }, {
quality: 50,
destinationType: navigator.camera.DestinationType.FILE_URI,
sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY
} );

对于sencha cmd 4.x
5、配置D:\Code\Android\sencha\MyApp\phonegap.local.properties文件
phonegap.platform=android
这样就是指定打包android平台的安装包,需要安装有对应平台的SDK

6、打包、运行
cd D:\Code\Android\sencha\MyApp
只打包:sencha app build native
打包并安装到模拟器或真机上:sencha app build -run native

对于sencha cmd 5.x
5、在app.json里面写下面的内容

6、打包、运行
打包android只要执行命令:sencha app build android
打包ios只要执行命令:sencha app build ios


关于打包后安装到手机的App名称问题
打包后的安装包安装之后名字是”MyApp”,如果要换成其他名字,修改D:\Code\Android\sencha\MyApp\config.xml文件,把顶部”MyApp“中间MyApp的改成需要的名字。
注意如果xml内容有中文,要改成utf-8编码,注意是文本文件的编码,不是顶上的”

相关文章推荐

[Phonegap+Sencha Touch] 移动开发70 cordova app中使用增强的webview

一、CrossWalk/XWalk(安卓) 安卓WebView在不同版本的安卓系统上表现参差不齐,这种不一致性使开发者非常头疼。虽然安卓4.4开始Google将安卓内置WebView内核更换为了Chr...

[Phonegap+Sencha Touch] 移动开发61 使用 URL Schemes实现一个App启动另一个App的功能

一个App可以启动同一设备上的其他App,可以方便和提高用户体验。URL Schemes是一种机制,提供了一个App启动或恢复另一个App的能力。但URL Schemes真正强大的是用它来传递数据到另...

[Phonegap+Sencha Touch] 移动开发17 使用桌面chrome调试安卓设备上的chrome和cordova app(webview)

调试安卓设备上的chrome浏览器:

[Phonegap+Sencha Touch] 移动开发54 初次使用Android Studio遇到的2个问题

一、安装完初次打开Android Studio,进度条一直在转(Fetching Android SDK component information),如下图 解决办法: 1、打开Androi...

[Phonegap+Sencha Touch] 移动开发17 使用桌面版chrome调试安卓设备上的chrome和webview

调试安卓设备上的chrome浏览器: 要求: 1、一台安装有chrome浏览器 for android32+的安卓设备 2、安卓设备的usb数据线 3、安装有chrome ...

[Phonegap+Sencha Touch] 移动开发53 Cordova/Phonegap 4(或5) 多了什么?

Cordova 4(或5)其实是Cordova CLI 4(或5),即命令行工具版本是4(或5)。 截至本文发表日期,Cordova CLI最新版本5.1.1,其中的Cordova Android...

[Phonegap+Sencha Touch] 移动开发37 sencha cmd 5.x须知

Sencha cmd 5.x创建打包ST项目的方法,和4.x的时候有很大的不同,具体可以看

[Phonegap+Sencha Touch] 移动开发29 安卓navigator.camera.getPicture得到图片的真实路径

phonegap的拍照插件选择图库中的图片,代码如下: navigator.camera.getPicture(function(uri){ console.log(uri);//这里得到图片的u...

[Phonegap+Sencha Touch] 移动开发56 安卓要注意不同CPU指令集的第三方.so库文件的引用

公司有个测试人员的手机是联想的机器,x86的cpu。 公司App用到了百度云推送、百度地图和百度定位,安卓项目中分别引用了这三个SDk的.so库文件 注:.so库文件,C++编写的,比java运行速度...

[Phonegap+Sencha Touch] 移动开发72 List列表横向滑动操作(仿QQ列表滑动删除)

请看示例图,仿照的QQ的列表横滑删除。 支持Ext.dataview.List和Ext.dataview.DataView。本功能是Sencha touch插件类(不是Cordova插件),可...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:[Phonegap+Sencha Touch] 移动开发5、Sencha touch结合Phonegap使用
举报原因:
原因补充:

(最多只允许输入30个字)