Собираем
информацию
по крупицам
Статьи - Компьютерное

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

Ext JS 4.2. Часть 3.3: Определение контроллера
29-09-2013
14:20:44

 

Определение контроллера

 

Контроллеры - это тот клей, который связывает все части веб-приложения воедино. Контроллеры отлавливают возникновения событий (чаще всего событий, возникающих в представлениях) и выполняют множество других действий. Давайте создадим контроллер Users для нашего приложения. Создадим файл /app/controller/Users.js и добавим в него следующий код:

 

Ext.define('AM.controller.Users', {
   extend: 'Ext.app.Controller',

   init: function() {
     console.log('Инициализация пользователей. Этот код срабатывает перед тем, как будет вызвана функция launch(), запускающая код основного приложения.');
   }
});

 

Далее надо добавить этот контроллер в конфигурацию веб-приложения в файле app.js:

 

Ext.application({
...
   controllers: [
     'Users'
   ],
...
});

 

 

Когда в браузер загружается центральный файл веб-приложения index.html, контроллер Users будет подгружен автоматически (так как мы его прописали в конфигурации нашего приложения), и его функция инициализации будет вызвана перед launch-функцией основного приложения.

 

Функция инициализации init() - это прекрасное место чтобы прописать, каким образом контроллер будет взаимодействовать с представлением, и обычно используется совместно с еще одной функцией контроллера - control(). Функция control() позволяет отлавливать события, возникающие в классах представлений и назначать им функции обработки. Давайте изменим код контроллер Users так, чтобы отловить момент отрисовки панели:

 

Ext.define('AM.controller.Users', {
   extend: 'Ext.app.Controller',

   init: function() {
     this.control({
       'viewport > panel': {
         render: this.onPanelRendered
       }
     });
   },

   onPanelRendered: function() {

     // Сообщение появляется при отрисовке панели
     console.log('The panel was rendered');
   }
});

 

 

Мы изменили функцию init() так, чтобы через вызов this.control() был установлен обработчик событий, срабатывающий при отрисовке панели. Функция control() использует подсистему ComponentQuery для доступа к любому компоненту на странице. Если вы не знакомы с ComponentQuery, обратитесь к документации, чтобы научиться полноценно работать с ней. Кратко говоря, эта подсистема позволяет обращаться к компонентам страницы посредством CSS-подобных селекторов.

 

В нашей функции init() мы использовали селектор 'viewport > panel', что означает "найти каждый элемент Panel, который является прямым потомком элемента Viewport". А так же мы привязали события, возникающие в найденных объектах (в нашем случае это события отрисовки, т. к. мы задали опцию render:) к функции-обработчику onPanelRendered(). В результате, каждый раз, когда будет совершаться событие отрисовки в элементах, подходящих под указанный нами селектор, будет вызываться функция onPanelRendered().


Когда мы запустим приложение, мы увидим следующее:

 

Продемонтрированный пример кода весьма далек от того, что пишется на практике, но он показывает насколько легко можно правильно организовать проект. Давайте теперь усложним наше приложение и добавим на экранную форму таблицу с данными.

 

 



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

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


Mplayer / Mencoder » Как быстро удалить произвольную часть видео из видеофайла

Чтобы удалить ненужные части из видеопотока, можно воспользоваться EDL-файлом.Изначально EDL-файл предназначен для того, чтобы при просмотре фильма ск...


Программирование на C++ и Qt » Как в Linux глобально отловить нажания клавиш в X11 (XWindow)

Несколько раз я пытался найти пример кода, который бы позволял отслеживать события нажатия и отжатия клавиш в нашем любимом X-сервере. Важный момент: ...


Платформа 1C:Предприятие » Как сделать выпадающий список в 1С v.8.2

Платформа 1С:Предприятие - прекрасная вещь. Платформа хорошо спроектирована именно для своей предметной области, а большего, впринципе, и не требуется...

RSS подписка

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

Поделиться этой страницей


Статистика


Рамадан намаза в Грозном время намаза на сегодня в Грозном mynamaz.ru/gorod/groznyy.

Внимание!


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

 

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

База Rarrugas (1, 2)

База Balas

База YellowRaven

База Yurons

База Lesnik757

База Shandor

База Sirrichar

База Anatolean

База Аrmagedec

База SorokinRed

База Deadelf79

База Adgaver (1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12)

База Pipitos1983

База Soxsten

База Silenn

База Shlyapnikova - херомантия и ригидность

База Svoynickname

База Larson227

База Velonski

База BrokeRU

База Mcold

 

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

 

База Tairesh

База Ivnglkv

База Kolyag87

База Andyk101

База Garik456456

База Harpokrat

База SalexIzyh

База Duwaz

База RuDennn

База Manakaden

База Vitvrn

База Fanrok

 

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

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