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

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 

} );

 

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

 

---------------------------------------------------------------------------------------------------------------------------------------------------------

关于打包后安装到手机的App名称问题

打包后的安装包安装之后名字是"MyApp"，如果要换成其他名字，修改D:\Code\Android\sencha\MyApp\config.xml文件，把顶部"<name>MyApp</name>"中间MyApp的改成需要的名字。

注意如果xml内容有中文，要改成utf-8编码，注意是文本文件的编码，不是顶上的"<?xml version='1.0' encoding='utf-8'?>"。

推荐用Notepad++更改文本文件的编码

想了解更多，请查看：《移动开发18 Sencha Touch项目通过phonegap打包后的程序名字的问题》
-------------------------------------------------------------------------------------------------------