ext-ui.com

Sencha Touch Ext.app.Application

Ext.app.Application一般用于app.js中

用来初始化整个应用

可以预先加载controllers(控制器),models(模型),stores(数据源),views(视图)

例如:

1.Ext.application({
2.    name: 'MyApp',
3. 
4.    controllers: ['Users'],
5.    models: ['User', 'Group'],
6.    stores: ['Users'],
7.    views: ['Main', 'ShowUser']
8.});

他们分别对应下面几个js文件

  •   app/model/User.js
  •   app/model/Group.js
  •   app/store/Users.js
  •   app/controller/Users.js
  •   app/view/Main.js
  •   app/view/ShowUser.js

如果应用结构比较复杂,例如在视图文件夹之中还创建了子文件夹,可以如下

1.Ext.application({
2.     name: 'MyApp',
3.  
4.     controllers: ['Users', 'nested.MyController'],
5.     views: ['products.Show', 'products.Edit', 'user.Login']
6. });

他们分别对应下面几个js文件

  •   app/controller/Users.js
  •   app/controller/nested/MyController.js
  •   app/view/products/Show.js
  •   app/view/products/Edit.js
  •   app/view/user/Login.js

以上两种方式结合如下

1.Ext.application({
2.     views: ['Auth.view.LoginForm', 'Welcome'],
3.     controllers: ['Auth.controller.Sessions', 'Main'],
4.     models: ['Auth.model.User']
5. });

他们分别对应下面几个js文件

  •   Auth/view/LoginForm.js
  •   Auth/controller/Sessions.js
  •   Auth/model/User.js
  •   app/view/Welcome.js
  •   app/controller/Main.js

为了方便管理,我一般只在这里引入控制层,其他的放在对应的控制层,app.js如下

01.//指定ux起调目录
02.Ext.Loader.setPath({
03.    'ux': 'app/ux'
04.});
05. 
06.Ext.application({
07.    name: 'app',
08.    controllers: ['Main', 'Job', 'User', 'New', 'Img', 'Question', 'Release'],
09.    requires: ['app.config', 'app.util'],
10.    //图标 
11.    icon: {
12.        '57': 'resources/icons/icon.png',
13.        '72': 'resources/icons/icon.png',
14.        '114': 'resources/icons/icon.png',
15.        '144': 'resources/icons/icon.png' 
16.    }, 
17.    //运行图标优先显示 
18.    isIconPrecomposed: true
19.    //不同分辨率对应的启动图片 
20.    startupImage: {
21.        '320x460': 'resources/startup/splash.png',
22.        '640x920': 'resources/startup/splash.png',
23.        '768x1004': 'resources/startup/splash.png',
24.        '748x1024': 'resources/startup/splash.png',
25.        '1536x2008': 'resources/startup/splash.png',
26.        '1496x2048': 'resources/startup/splash.png'
27.    }, 
28.    //当所有的引入项加载完成后,执行
29.    launch: function() {
30.        // Destroy the #appLoadingIndicator element
31.        util.inIt();
32.        Ext.fly('appLoadingIndicator').destroy();
33.    }
34.});

其中值得注意的属性有

  appFolder 默认值:app 应用目录名称

  所以我们的主要代码是放在app目录中的,当然也可以改成其他的值,比如test

  不过更改之后最好如下设置,以免应用出现问题,个人建议默认即可

1.Ext.Loader.setPath({
2.     'app': 'test'
3. });

name 默认值:app 应用程序名称

  如果你改成其他的名称,比如test

  那你注册一个model他的名称应该是类似test.model.user

  个人建议使用默认值

  

  icon 应用启动图标

  如果使用cmd打包应用,需要配置

  requires 引入指定js

  比如全局配置文件,全局共用方法,消息提示组件等

关于Ext.app.Application有其他看法和疑问的欢迎留言探讨

作者: 魔狼再世
原文: http://www.cnblogs.com/mlzs/p/3473407.html