Sencha Touch 2.3 + Cordova 3 环境搭建

采用Sencha Touch开发的App，如果用户点击退出按钮，则App会直接退出。

Sencha Cmd 4.0提供了访问Cordova的方法，可以解决上述问题。

一、准备工作

1. 安装Java JRE

2. 安装Node.js

3. 安装Cordova：在命令行中输入npm install -g cordova

4. 下载ANT，并把ANT的路径（例如：C:\apache-ant-1.9.4\bin）加入到系统环境变量path中

5. 下载Android SDK Manager，并把SDK的路径（例如：C:\adt-bundle\sdk\tools）加入到系统环境变量path中

6. 安装git，在Configuring the line ending conversions时选择"Checkout as-is, commit as-is"这个选项

    在Adjusting your PATH environment时选择"Use Git from the Windows Command Prompt"

二、创建应用程序

1. 创建Sencha Touch项目：命令行切换到sencha touch sdk目录，输入sencha generate app SenToCo D:\sentoco

    （具体参见上一篇《sencha touch初步》）

2. 启用Cordova支持：命令行切换到项目目录，输入sencha cordova init com.mydomain.sentoco SenToCo

    其中com.mydomain.sentoco是app id，SenToCo是工程的名称，也是应用的名称。

    如果出现could not find file config.xml to copy的错误，找到文件

    Sencha\Cmd\4.0.2.67\extensions\cmd-cordova-packager\cmd-cordova-packager.plugin.xml

    将文件中的

<echo>Adding Cordova config.xml to App</echo><copy file="${app.cordova.www.dir}/config.xml" todir="${app.dir}"/>

    改为

<echo>Adding Cordova config.xml to App</echo><copy file="${app.cordova.dir}/config.xml" todir="${app.dir}"/>

    上述命令执行成功后目录结构如下：

3. 修改项目目录下cordova.local.properties文件中的平台列表

cordova.platforms=android

4. 在cordova中添加android平台：命令行切换到项目目录下的cordova目录，输入cordova platform add android

    如果出现Please install Android Target 19(the Android newest SDK). Make sure you have the latest Android tools installed as well的错误，则更新Android SDK

5.在cordova中添加Device功能（参考Apache Cordova Documentation）：命令行切换到项目目录下的cordova目录，输入

    cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-device.git

    如果添加成功则会出现以下界面：

    如果添加不成功可以手动添加，在https://git-wip-us.apache.org/repos/asf下载相应的插件

   下载后解压（例如：D:\cordova_plugin\cordova-plugin-device-4ae85e8\），命令行切换到项目目录下的cordova目录，输入

    cordova plugin add D:\cordova_plugin\cordova-plugin-device-4ae85e8\cordova-plugin-device-4ae85e8

6. 在cordova中添加Notification功能（参考Apache Cordova Document）：需要添加两个功能插件

    https://git-wip-us.apache.org/repos/asf/cordova-plugin-vibration.git

    https://git-wip-us.apache.org/repos/asf/cordova-plugin-dialogs.git

7. 在app.js中添加代码

    launch: function() {        // Destroy the #appLoadingIndicator element        Ext.fly('appLoadingIndicator').destroy();        // Initialize the main view        Ext.Viewport.add(Ext.create('SenToCo.view.Main'));                document.addEventListener("deviceready", onDeviceReady, false);                function onDeviceReady() {        // Register the event listener        document.addEventListener("backbutton", onBackKeyDown, false);    }// Handle the back buttonfunction onBackKeyDown() {  navigator.notification.confirm(        '确定退出应用？',  // 显示信息        onConfirm,        // 按下按钮后触发的回调函数，返回按下按钮的索引        '退出应用',       // 标题        '取消,确定'       // 按钮标签    );}                function onConfirm(button) {if (button == '2') {navigator.app.exitApp();}}    },

8. 打包应用程序：命令行切换到项目目录，输入sencha app build native

    如果全线飘绿就打包成功了，可以在D:\sentoco\cordova\platforms\android\ant-build目录下找到apk文件

参考：

Cordova and PhoneGap Apps

Cordova & PhoneGap with Sencha Cmd 4

Building an app with Sencha Touch 2.3 and Cordova 3

Cordova 3.0 Plugin 安装 及"git" command line tool is not installed

Possible bugs in: Sencha Cmd 4.0.1.45

Adding Cordova/Phonegap plugins behind a proxy

Sencha Cmd Cordova init problem

cordova3+sencha touch2.x 环境搭建