zoukankan      html  css  js  c++  java
  • Sencha Architect开发移动项目及Sencha Cmd对项目压缩Android应用程序

    最近群里很多人刚接触Sencha Touch  对开发Sencha Touch项目以及对做好的项目打包Android应用程序比较不了解,很多人都在问这一块的操作步骤,今天在机器里装了一个虚拟机,从0环境开始一步一步配置开发ST项目及生成Android应用程序。

    发布了之后发现很多截图都看不到了,把Word文档发上来方便大家查看:Architect开发移动项目

    文档内容:... 2

    操作步骤:... 2

    一、首先提前下载使用的软件:... 2

    二、软件安装... 2

    三、Sencha Architect创建项目... 4

    四、Sencha Architect开发一个List列表... 6

    4.1从左侧工具箱拖一个Panel到设计窗体... 7

    4.2拖一个List控件到Panel7

    4.3设置Panel布局fit. 8

    4.4拖拉store到右侧项目结构中的Stores. 8

    4.5设置List的数据源... 10

    4.6设置listitem显示模板... 11

    4.7切换回Design页面,查看效果... 12

    4.8使用Safari浏览项目下的index.html文件... 12

    五、使用Sencha Cmd对项目进行打包压缩... 12

     

     

     

    文档内容:

    (1)       Sencha Architect开发ST2项目

    (2)       Sencha Cmd对项目进行打包压缩(apk

    操作步骤:

    一、首先提前下载使用的软件:

    (1)       Sencha Touch SDK

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

    Sencha Cmd

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

    Sencha Architect

    http://cdn.sencha.io/architect/2.2.2-stable/SenchaArchitect-2.2.exe

     

    (2)       Android SDK Tools32位)

    http://dl.google.com/android/android-sdk_r22.0.5-windows.zip

     

    (3)       JDK

    http://download.oracle.com/otn-pub/java/jdk/7u40-b43/jdk-7u40-windows-i586.exe

    JRE Java Runtime Environmenthttp://www.oracle.com/technetwork/java/javase/downloads/jre7-downloads-1880261.html

     

    (4)       Ruby(需要2.0版本以下不包含2.0

    http://dl.bintray.com/oneclick/rubyinstaller/rubyinstaller-1.9.3-p448.exe?direct

    5  一款支持html5的浏览器(safarichrome

    二、软件安装

    (所有软件安装目录避免出现中文目录,否则执行sencha cmd容易识别为乱码造成执行失败)

    1  解压Sencha Touch SDK,解压目录放在D: ouch-2.2.1文件夹

    2  安装JRESencha CMD(安装cmd的时候,避免目录出现空格)、Ruby

    (3)       安装Sencha Architect

    (4)       如果想把开发的ST项目做成apk文件,则继续安装 JDKAndroid SDK

    (5)       打开Android SDK Tool下载Android开发需要下载的环境,自检过程中可能会无法连接GoogleFailed to fetch URL https://dl-ssl.google.com/android/repository/addons_list-2.xml, reason: Connection to https://dl-ssl.google.com refused),用记事本打开c:WINDOWSsystem32driversetc中的hosts文件、在最后一行添加74.125.237.1 dl-ssl.google.com

     

    点按钮“install 12 packages

     

    安装完成之后检查环节变量的配置情况:

    cmd命令行里输入:java(检查JRE)、sencha(检查Sencha Cmd)、ruby(检查Ruby)、keytool(检查JDK)如果有问题,手动把安装目录添加到环境变量中

    设置如下环境变量

    一:点新建,然后在变量名写上JAVA_HOME,顾名其意该变量的含义就是java的安装路径,呵呵,然后在变量值写入刚才安装的路径“C:jdk1.6”。(注:如果安装的路径不是磁盘C或者不是在jdk1.6这个文件夹,可对应修改。以下文字都是假定安装在C:jdk1.6里面。) 
    二:其次在系统变量里面找到path,然后点编辑,path变量的含义就是系统在任何路径下都可以识别java命令,则变量值为“.;%JAVA_HOME%in”(其中“%JAVA_HOME%”的意思为刚才设置JAVA_HOME的值),也可以直接写上“C:jdk1.6in” 
    三:最后再点新建,然后在变量名上写classpath,该变量的含义是为java加载类(class or lib)路径,只有类在classpath中,java命令才能识别。其值为“.;%JAVA_HOME%libdt.jar;%JAVA_HOME%lib oos.jar (要加.表示当前路径)”,与相同“%JAVA_HOME%有相同意思 

     

    三、Sencha Architect创建项目

    1

     

    2)点菜单中的保存(Save

     

    (6)       使用Sencha Cmd创建项目

     

             设置Sencha Cmd目录

     

    设置Sencha Touch SDK目录,点击Setup Project with Cmd

     

    创建packager.json(点击Add Package Settings

     

    四、Sencha Architect开发一个List列表

    需要用到的控件有:PanelListStore

    4.1从左侧工具箱拖一个Panel到设计窗体

     

    4.2拖一个List控件到Panel

     

    4.3设置Panel布局fit

     

     

    4.4拖拉store到右侧项目结构中的Stores

      设置store的属性:

    添加字段,点击图中的(+),增加两个字段(IDName

     

    添加数据

     

    添加如下结构的数据:

     

    4.5设置List的数据源

    搜索store属性,在下拉菜单中选择第四步中的store

     

    4.6设置listitem显示模板

     

    设置如下内容:

     

    4.7切换回Design页面,查看效果

     

    4.8使用Safari浏览项目下的index.html文件

    safari可以直接浏览文件,chromeie9ie10需要先对项目发布后使用web地址浏览。

    五、使用Sencha Cmd对项目进行打包压缩

    首先在Architect中对Packager.json进行设置

    1)设置打包平台(AndroidiOS),设置属性platform,下拉菜单中选择Android

    2)设置Android SDK的目录(相对目录和绝对目录均可),注意目录中使用”/“不要使用””

    3设置安卓SDK的版本号(版本号可以通过Android SDK目录下的SDK Manage.exe查看)

    4)设置签名目录(certificatePath)、别名(certificateAlias)和密码(certificatePassword)的方法,查看http://docs.sencha.com/cmd/3.1.2/#!/guide/native_packaging中的第一步操作(keytool命令生成签名文件)

    5)在命令行中使用cd切换当前目录到你的ST2项目目录,然后输入命令sencha app build native 打包本地文件(直接创建apk文件,且对js文件进行压缩)

    6)打包完成之后在你项目目录的build est会有两个文件夹:nativepackage

    Native里有一个test.apk文件(安卓应用程序)

    package文件夹可以作为你的web的发布文件(cmd使用cd切换到package目录),运行命令 sencha fs web –port 8000 start –map .  发布package文件夹为8000端口网站,然后用safari浏览:http://localhost:8000,会看到如下效果:

     

  • 相关阅读:
    关于unbox.any castclass ldobj
    SQL 语句 之 增删改查 (一)
    .NET(C#):使用SmtpClient发送带有图片和附件的电子邮件
    Ext.Net 1.2.0_演示 Ext.Net+QRCode 封装条形码控件
    局域网共享打印机(不需要密码)
    Windows 2003单用户单会话登录远程桌面
    不过如此
    CellMerge
    Windows Server 2008服务器支持iso文件下载的方法
    SQL2008 Express 无法打开备份设备 '‘xxxxx'。出现操作系统错误 5(拒绝访问。)。BACKUP DATABASE 正在异常终止。
  • 原文地址:https://www.cnblogs.com/softxu/p/3340975.html
Copyright © 2011-2022 走看看