Ext4.2学习笔记-Ext.application

Ext.app.Application 代表一个ExtJS4 应用.这是一个典型的使用Viewport的单页应用.一个典型的Ext.app.Application 一般如下:

Ext.application({
    name:'MyApp',
    launch:function(){Ext.create('Ext.container.Viewport',{
            items:{
                html:'My App'}});}});

这做了很多的事情。首先，创建了一个名为MyApp的全局变量.所有的应用程序类(如Models,Views,Controllers)都被认为在一个单独的命名空间下。这大幅降低了全局变量名冲突的机会。MyApp也有一个全局的方法来获得对当前应用的引用

var app =MyApp.getApplication();

当所有的页面内容准备好并且所有的javascript被加载后，你的应用程序的launch函数被调用，此刻启动您的应用程序并运行代码。通常这些代码就想我们上面的实例一样包含创建一个Viewport

 

告诉整个应用的rest

由于一个Ext.app.Application代表了一个完整的app，我们也告诉应用程序的其他部分。比如，我们有个blog管理系统。我们可能有文章和评论的模型，控制器以及列举，增加，编辑文章和评论的视图。我们如何通知我们的应用程序这些事情呢：

Ext.application({
    name:'Blog',
    models:['Post','Comment'],
    controllers:['Posts','Comments'],

    launch:function(){...}});

注意：实际上，我们并没有在应用程序中直接列举视图。这是因为视图由控制器管理，这很明显的保持了这些依赖。应用程序将按照应用程序架构指南中描述的路径约定加载每个指定的控制器--这种情况下，假定控制器被放置在app/controller/Post.js和app/controller/Comments.js中。换句话说，每个控制器都需要显示他用到的视图并且自动加载他们。以下是文章控制器如何定义:

Ext.define('MyApp.controller.Posts',{
    extend:'Ext.app.Controller',
    views:['posts.List','posts.Edit'],//the rest of the Controller here});

因为，我们已经告诉了应用程序关于Models和Controllers，以及控制器对应的视图，ExtJS将为我们自动加载app文件。这意味着当我们需要增加一个新类的时候，不需要增加script标签到我们的html中，而且更重要的是他可以让我们使用SenchaCmd 创建整个应用程序一个最小的构建

 

从Ext.app.Application中导出(派生Ext.app.Application)

通常，应用程序不能直接从Ext.app.Application中导出，但，可以通过配置Ext.application模仿在派生类中你能做什么。然而，在有些情况下，你也可以通过Ext.app.Application的派生类来描述通用逻辑

？？？

Ext.define('MyApp.app.Application',{
    extend:'Ext.app.Application',
    name:'MyApp',...});Ext.application('MyApp.app.Application');

？？？

要了解更多关于ExtJS4 应用程序信息，请查看应用程序架构指南