ext-ui.com

中文教程

Sencha架构解读

Posted 周五, 02/08/2013 - 23:55 by admin

sencha是移动端的html5框架，可以用来制作跨平台的app应用。sencha内部利用mvc结构，使得整个框架在使用时能够保持代码的整洁，也易于测试和修改。

一个 sencha app是一个由model，controller，view，store，profile，再加上一些静态资源，例如：app的图标，加载页面图片等组成的集合
models：表明了app的类型,比如，电子商务型的app应该有 用户，产品，订单等模块
views：负责想用户展示数据，使用sencha 内部已有的组件
controllers:处理内部各部分之间联系，监听用户的点击、滑动并采取相应行动
store：负责加载数据，增强里内部组件的能力，如Lists和DataViews
Profile：能够在公用尽量多的代码的同时，很便利的优化app在平板和手机的UI

建立一个app通常要做的第一件事就是定义application，如下

Sencha Touch 2 快速入门

Posted 周日, 01/06/2013 - 11:02 by admin

什么是Sencha Touch?

Sencha Touch使得你可以便捷地创造一个基于HTML5的手机应用，支持Android、iOS和黑莓等设备，并且在浏览器中创造原生APP般的体验。

你需要准备好

首先，你需要下载免费的Sencha Touch 2 SDK 和 SDK Tools （或者Sencha Cmd ) 。你还需要：
一个本地的web server
现代浏览器；推荐 Chrome 和 Safari （请不要用IE6！！）
如果你是在Windows上使用IIS，请记得添加 application/x-json 这个MIME Type，否则Sencha Touch不能正常工作。你可以从这里知道应该如何做：
http://stackoverflow.com/a/1121114/273985（很抱歉我并不使用IIS，没有对这个链接中的方法进行测试）。

ExtJS入门——开始

Posted 周五, 12/14/2012 - 01:40 by admin

认识ExtJS
extjs是使用javascript、css和html等技术实现的主要用于创建用户界面，且与后台技术无关的前端ajax框架。
extjs来源于yui，开发理念来源于传统的桌面软件开发。

1.下载extjs，解压，得到目录结构

  • builds：是extjs压缩后的代码，体积更小，加载更快
  • docs ：extjs的文档
  • examples：官方示例
  • locale：多国语言的资源文件
  • overview：extjs的功能简述
  • pkgs：extjs各部分功能的打包文件
  • resource：extjs要用到的图片文件与样式文件。
  • src：未压缩过的代码目录
  • bootstrap.js：extjs库的引导文件
  • ext-all.js ：必须引入的核心库
  • ext-all-debug.js：ext-all.js的调试版

在MyEclipse和Tomcat下配置Sencha Touch环境

Posted 周五, 12/14/2012 - 01:17 by admin

首先要配置开发环境。这个很简单，只要到官方网站下载Sencha Touch压缩包即可http://www.sencha.com/products/touch/。
开发工具随便一个编辑器，记事本也可以的。
本人用的是MyEclipse+Tomcat，Sencha Touch用的是1.01版本(使用MyEclipse+Tomcat我为了以后例子可以跟后台交互)
其实可以直接浏览本地静态html文件的。

ExtJS中layout的用法总结

Posted 周二, 12/11/2012 - 10:03 by admin

好久没看过EXT了，最近项目中需要用到就重新复习了下，对于一些知识也都模糊不清，现对Extjs中的layout布局进行总结下：
layout中有absolute,anchor,border,accordion,card,form,table,column,fit这几种，现一一举例：
1.absolute根据字面意思就知道，是根据具体坐标进行定位的，固不写相应的代码了，其他的如下
2.anchor:其值可以使百分比和数值，数值一般为负数，其代表的意思是如果宽度和长度中有一个设定值了，则anchor代表的是未设置的那个，如果两者都没有设定具体值，则如果需要使用anchor则需要anchro:'ww,hh'

聚合内容