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

Перевод документации 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), которая заполняет все пространство рабочего окна:

 

 

 


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

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


Общество » Литература пыльного века

Эту статью я писал как ответ на небольшой вопрос о литературе будущего, заданный на Хабрахабре. Здесь размещена отредактированная и дополненная версия...


Перевод документации Ext JS 4.2 » Ext JS 4.2. Часть 3.7: Сохранение данных в Модели данных

    Сохранение данных в Модели данных   В настоящий момент мы имеем таблицу с данными пользователя и окно, которое открывается при двой...


Игры под Windows » Shareholder (Акционер)

Игра, написанная вместе с Сергеем Шпаковым. Разработка застыла на этапе глубокой беты. Шпаков сделал интерфейс и хотсид, я писал искуственный интеллек...

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, 19)

База Rarrugas (1, 2)

База Balas

База YellowRaven

База Yurons

База Lesnik757

База Shandor

База Sirrichar

База Anatolean

База Аrmagedec

База SorokinRed

База Deadelf79

 

Требуют доработки:

 

База Tairesh

База Ivnglkv

База Kolyag87

База Andyk101

База Garik456456

База Harpokrat

База SalexIzyh

База Duwaz

 

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

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