Собираем
информацию
по крупицам

Перевод документации Ext JS 4.2

Ext JS 4.2. Часть 3.2: Создание приложения в файле app.js
29-09-2013
14:19:29

 

Создание приложения в файле app.js

 

В коде, написанном в предыдущем параграфе, видно, что в основной HTML-файл подключаются два *.js файла. В файле ext-debug.js находится код фреймверка Ext JS 4, а в файле app.js следует расположить стартовый код создаваемого веб-прилоожения. В этом параграфе речь идет о содержимом файла app.js.

 

Каждое приложение Ext JS 4 начинает свою работу с экземпляра класса Application. Объект Application содержит глобальные настройки всего приложения (такие, как название приложения), а так же в нем перечисляются ссылки на все модели, представления и контроллеры, используемые в приложении. Объект Application так же содержит функцию запуска, которая автоматически запускается в тот момент, когда все необходимые компоненты полностью подгружены в браузер.

 

Давайте создадим простой менеджер учетных записей пользователей, который поможет нам управлять учетными записями пользователей на сайте. Вначале нам нужно задать область видимости нашего приложения в виде глобальной переменной. Это будет основная область видимости, и все остальные классы веб-приложения будут доступны внутри неё. Удобнее использовать короткое имя, так как оно будет часто употребляться в коде. Так как по-английски проектируемое нами приложение называется Account Manager, зададим в качестве глобальной области видимости переменную "AM":

 

Ext.application({
   requires: ['Ext.container.Viewport'],
   name: 'AM',

   appFolder: 'app',

   launch: function() {
     Ext.create('Ext.container.Viewport', {
       layout: 'fit',
       items: [
         {
           xtype: 'panel',
           title: 'Users',
           html : 'List of users will go here'
         }
       ]
     });
   }
});

 

В вышеприведенном коде есть несколько важных вещей. Во-первых, мы делаем вызов Ext.application() для создания экземпляра класса Application, и задаем ему имя 'AM' - оно указано в опции name (или, говоря языком ООП, в свойстве name. Но мы далее будем использовать термин "опция"). В результате будет автоматически создана глобальная переменная AM, содержащая область видимости приложения. Она будет использоваться в Ext.Loader, которому передается путь 'app' из опцииа appFolder. Мы так же создали простую функцию launch(), запускаемую при старте. В ней создается рабочее окно (Viewport), внутри которого размещена одна панель (Panel), которая заполняет все пространство рабочего окна:

 

 

 


К списку "Компьютерное"

Интересное на сайте


Гаджеты » Как я тестировал Multiclet

Не так давно екатеринбургская компания ОАО «Мультиклет» начала программу по активной популяризации своего микропроцессора, основанного на ...


Интерфейс и юзабилити » Оформление кода: Почему я выбрал для себя отступ в 2 пробела?

В мире программирования существует достаточно холиварная тема: "Каким должен быть отступ в коде"?   Оставим за бортом споры по теме "Форматироват...


Демо на Ассемблере » Atommash

Размер: 1253 байт Требования: DOS 6.22, AdLib Sound Год: 1999   Интро для моей второй FIDO-ноды N5062/10, я на ней жил некоторое время. Инт...

RSS подписка

Подпишитесь на новости сайта по RSS


The project по актуальным расценкам Курсы визажа спб www.graftobian.ru.
Клининговые компании в краснодаре kpk-company.ru.

Внимание!

На этом сайте разрабатывается программа MyTetra и её родственные проекты.

Доступны к просмотру следующие базы знаний:

База Xintrea (1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18)

База Rarrugas (1, 2)

База Balas

База YellowRaven

База Yurons

База Lesnik757

База Shandor

База Sirrichar

 

Подробности на странице MyTetra Share.

 WebHamster.Ru
 Домик любопытного хомячка
Яндекс индекс цитирования
Почтовый ящик