Sencha Toucha 2 —1.环境安装配置、在线打包、离线打包

环境安装配置       

1. 下载       

1.1     Sencha Touch 下载

http://cdn.sencha.com/touch/sencha-touch-2.2.1-gpl.zip

1.2     Sencha Touch Docs下载

http://cdn.sencha.com/downloads/docs/touch-docs-2.2.1.zip

1.3     Sencha Touch CMD下载

http://www.sencha.com/products/sencha-cmd/download  

1.4     JRE下载

http://www.oracle.com/technetwork/java/javase/downloads/jre7-downloads-1880261.html  

1.5     Ruby 下载

http://rubyinstaller.org/downloads/  

2. 安装       

2.1     将Sencha Touch 以及Sencha Touch CMD部署到IIS上

注意需要添加MIME类型扩展名为“.json”,MIME类型为” application/x-json”或“application/x-javascript”;测试网站即可使用

2.2     安装JRE

2.3     安装Sencha Touch CMD

2.4     安装Ruby:

Ruby 安装之后 ,打开Start Command Prompt with Ruby,命令控制器:输入sass –v 提示不是内部命名,这时需要安装:gem install sass 安装即可,安装之后继续安装compass:gem install compass。

3. 创建第一个App       

从CMD进入SDK(sencha touch)所在的根目录,使用以下命令创建app

Sencha generate app App名称 App路径

例如:sencha generate app MyApp ../MyApp

至此,一个app创建完成

4. App文件简要描述       

app:主要就是模型,视图,控制器,和商店。(sencha Touch 2主要使用的是MVC模式思想)

app.js:主要的js代码,以及应用的入口application

app.json:配置文件

index.html:应用的html代码

packager.json:应用中所用的包

resources:主要是资源文件,CSS、images等

基本介绍:application为应用程序的首要执行方法,launch方法是程序的入口,类似main方法,但是这里的launch可不是唯一进入程序的入口。默认视图窗口使用卡片布局,默认的应用程序添加到主视图窗口,使其可以使用

         打开文件app/view/Main.js

5. 发布应用       

Sencha app build CMD:具体命令有一下几种

测试程序:testing - intended for QA prior to production. All JavaScript and CSS source files are bundled, but not minified, which makes it easier to debug.

包:package - creates a self-contained, redistributable production build that normally runs from the local file system without a web server.

产品:production - creates a production build that is normally hosted on a web server and serves multiple clients (devices). The build is offline-capable using HTML 5 application cache, and is enabled to perform over-the-air updates.

本地:native - first generates a package build, then packages it as a native application, ready to be deployed to native platforms.

例如:cmd》sencha app build production

第一次运行:可能会出现error

Please ensure this command was executed from a valid application directory

Unable to locate 'app.dir' config property from sencha.cfg

这可能是你没有进入你的应用程序的根目录

         这时在你的应用程序的Build下即可找到你打包的应用

在线打包       

6. 使用在线打包发布各种版本       

前提:将刚刚build之后的文件打包成zip格式,即名称为production.zip

    6.1   PhoneGap:打开网址:     https://build.phonegap.com/     (提前需要注册一个账户)  

6.2   点击右上角sign in

6.3   在进入之后使用sign in with Github一起登陆,输入用户名密码,登陆就可以了。

6.4   登陆之后右上角会有一个“+new app”,选择private,选择upload a.zip file

6.5   上传production.zip此文件即可

离线打包       

7. phonegap离线打包       

7.1   下载地址:     http://phonegap.com/install/  

将docs文档部署成网站:查看菜单为: Platform Guides

这里你会找到各种平台的部署生成

7.2   安装 android 开发环境:eclipse、android sdk,adt

7.3   创建一个android应用程序,一直下一步就好

  1. 进入:E:\Work_Shine\WebFenZhenTai\phonegap-2.9.0\lib\android,也就是phonegap目录下
  2. 将“cordova-2.9.0.jar”拷贝至新建android项目的libs下。
  3. 在任何一个文件夹上右键单击选择“build Path”-》Configure build path-》libraries-》Add jars-》找到刚刚添加的jar文件。(注:也就是相当于添加引用)
  4. 在assets上添加文件夹,名称为:www,并且将“E:\Work_Shine\WebFenZhenTai\phonegap-2.9.0\lib\android”上的cordova.js拷贝过来
  5. 进入到src-》com.shine.phonegap 下,打开.java文件,将“Activity”写改成 DroidGap,并添加引用import org.apache.cordova.DroidGap;
  6. 注释掉:
    /*
    
             @Override
    
             public boolean onCreateOptionsMenu(Menu menu) {
    
                       // Inflate the menu; this adds items to the action bar if it is present.
    
                       getMenuInflater().inflate(R.menu.main, menu);
    
                       return true;
    
             }
    
    */
    
    //setContentView(R.layout.activity_main);

    以及将“protected void onCreate(Bundle savedInstanceState) {”

    修改成public void onCreate(Bundle savedInstanceState) {

    添加这句:super.setIntegerProperty("loadUrlTimeoutValue", 60000);//加载url超时时间

    继续添加:super.loadUrl("file:///android_assets/www/index.html");

    将生成好的production拷贝至www文件夹即可

    附注:android打包       

       打包,一般时候有些人使用这个保存放位置的bin下的文件下的apk,这是多数没有签名,故一般时候使用

                       项目上—》右键单价-》Android Tools-》Export signed Application Package-》下一步-》如果有可以使用原来的,没有可以创建一个,以及密码

                       下一步使用-别名,基本设置。

                       下一步签名文件存放位置

             至此一个本地打包完成。。

posted @ 2014-03-03 15:22  还是你最好  阅读(3382)  评论(0编辑  收藏  举报