Sencha Touch 2.x FAQ – 多级目录下 Ext.application 中 views 的写法

原先我们的 view 目录下有两个文件:Main.js 和 Home.js,相应的在 Ext.application({…}) 中 views 的写法应该如下:

...
views: [
  'Main',
  'Home'
],
...

假设我们重新组织了 view 目录:在 view 目录下新建一个 login 目录,把 Home.js 放入新建的 login 目录;在 view 目录下再新建一个 main 目录,把 Main.js 放入 main 目录。那么现在 views 的写法应该如下:

...
views: [
  'main.Main',
  'login.Home'
],
...

注意,不是 ‘main/Main’,也不是 ‘main\Main’,而是 'main.Main'

Sencha Touch 2.x FAQ – 把 app/view 下面的文件再用几个目录组织起来之后,程序应该相应的做什么样的修改?

按照 Sencha Touch 的编码约定,把 view 下面的文件的类名改成带子目录的即可,
比如原先我们有一个 Main.js 的 view 文件在目录 app/view 下面,Main.js 中的类定义应该类似于:Ext.define(‘Sencha.view.Main‘, {… }); 这样。

现在我们在 app/view 下面又建了一个 main 目录,即 app/view/main 目录,我们把 Main.js 移到现在这个目录下面。那么现在 Main.js 中的类定义就得改成:Ext.define(‘Sencha.view.main.Main‘, {…}); 依此类推即可。

Sencha Touch 编码约定 -> 命名空间和代码组织

  1. OrganizationName.group[.subgroup].ClassName
  2. 每个类一个单独的文件
  3. 文件名称要和类名一致
  • Ext.chart.Label -> Ext/chart/Label.js
  • Ext.data.writer.Xml -> Ext/data/writer/Xml.js
  • MyApp.field.Password -> MyApp/field/Password.js

本文地址:http://www.tfan.org/sencha-touch-2-x-faq-namespacing-and-code-organization

Sencha Touch 2.x FAQ – 增加一个 View 到 tabpanel 都需要哪些必备的配置信息 ?

和 iOS 类似,要在 tabpanel 中作为一个 Tab 显示的 View 需要提供 tabbar 显示所需的的 title 和 icon 以供正常显示。其中 title 或 icon 两个必须提供一个。否则会提示:Uncaught Error: [ERROR][Ext.Container#onFirstItemAdd] Adding a card to a tab container without specifying any tab configuration

在 View 的 Config 下面配置 titleiconCls 两个属性,例如

Ext.define('mu.view.PresidentList', {
 extend: 'Ext.List',
 xtype: 'president_list',

 config: {
 title: 'presidents',
 iconCls: 'team',
 itemTpl: '{firstName} {lastName}',
 store: "Presidents"
 }
});

原文地址:http://www.tfan.org/faq-configuration-required-to-add-view-to-tab-panel/

Tips – TextMate 的 Sencha Touch bundles

git clone git://github.com/edspencer/Sencha.tmbundle.git

双击 clone 下来的 bundle 安装即可,支持 Sencha Touch 2。

简单用法

比如我们要来定义一个新的类,在编辑器窗口输入 “def” 然后按 “tab” 键,相应的代码片段就生成了。

/**
 * @class MyNamespace.Presidents
 * @extends Object
 * Description
 */
Ext.define('MyNamespace.Presidents', {
 extend: 'Object',

 config: {

 }
});

sencha-touch-textmate-bundles

原文地址:http://www.tfan.org/tips-textmate-sencha-touch-bundles/