Шаблон Модель-Представление-Контроллер

Шаблон Модель-Представление-Контроллер. fla_master

Продолжение статьи: Что такое шаблон Модель-Представление-Контроллер?

SRC:
O’Rеillу. ActionScript 3.0 Design Patterns.
Глава 12. Model-View-Controller Pattern.

Продолжение. См. начало главы об MVC



Создание вложенных Представлений

Для демонстрации вложенных Представлений мы создадим узел составного Представления и два дочерних компонента, как показано на Рисунке 12-2.



Рисунок 12-2. Структура вложенных Представлений в минималистичном примере


Сначала мы создадим составное Представление под названием RootNodeView. Это составное Представление будет получать ввод с клавиатуры от сцены. Это Представление также зарегистрируется для получения уведомлений об обновлении от Модели. Составное Представление RootNodeView обзаведется двумя дочерними компонентами: CharCodeLeafView и AsciiCharLeafView. CharCodeLeafView будет отслеживать код последнего введенного с клавиатуры символа. AsciiCharLeafView будет отслеживать ASCII-символ, соответствующий этому коду символа. Давайте сначала создадим составное Представление, как показано в Примере 12-9.

Пример 12-9. RootNodeView.as

package {

   import flash.events.*;

   import flash.display.*;



   public class RootNodeView extends CompositeView {



      public function RootNodeView(aModel:IModel,aController:Object=null) {

         super(aModel,aController);

         // подписывается на получение событий нажатий клавиш от сцены

         target.addEventListener(KeyboardEvent.KEY_DOWN,this.onKeyPress);

      }



      private function onKeyPress(event:KeyboardEvent):void {

         // передается на обработку в Контроллер (Стратегия)

         controller  as  IKeyboardInputHandler.keyPressHandler(event);

      }



   }

}

Класс RootNodeView, показанный в Примере 12-9, расширяет класс CompositeView. Он не отрисовывает пользовательский интерфейс, а просто слушает события нажатия клавиш и передает их на обработку Контроллеру. Обратите внимание на присутствие super в конструкторе, что требуется для вызова конструктора родителя класса. А теперь мы можем создать два компонентных Представления (Примеры 12-10 и 12-11).

Пример 12-10. CharCodeLeafView.as

package {

   import flash.events.Event;



   public class CharCodeLeafView extends ComponentView {



      public function CharCodeLeafView(aModel:IModel,aController:Object=null) {

         super(aModel,aController);

      }



      override public  function update(event:Event=null):void {

         // получить данные от Модели и обновление Представления

         trace(model.getKey());

      }



   }

}

Пример 12-11. AsciiCharLeafView.as

package {

   import flash.events.Event;



   public class AsciiCharLeafView extends ComponentView {



      public function AsciiCharLeafView(aModel:IModel,aController:Object=null) {

         super(aModel,aController);

      }



      override public  function update(event:Event=null):void {

         // получить данные от Модели и обновление Представления

         trace(String.fromCharCode(model.getKey()));

      }



   }

}

Оба класса компонентного Представления — CharCodeLeafView (Пример 12-10) и AsciiCharLeafView (Пример 12-11) — расширяют класс ComponentView (Пример 12-8). Обратите внимание, что они не получают пользовательского ввода. Поэтому этим двум Представлениям не требуется принимать ссылку на Контроллер в конструкторе. Ссылка на Контроллер в данном случае будет иметь значение по умолчанию null.

Все что теперь осталось, это построить триаду MVC с вложенными Представлениями. Мы позволим клиенту строить вложенные Представления и зарегистрировать корневой узел в Модели для получения уведомлений об обновлении


Построение структуры вложенных Представлений

Построение структуры вложенных Представлений идентично разработке составной структуры с использованием шаблона Компоновщик. Мы можем представить себе Предсталение как дерево (расширяющееся сверху вниз) и использовать метод add() для добавление в составное Представление дочерних Представлений.

var model:IModel = new Model( );



var controller:IKeyboardInputHandler = new Controller(model);



// составное Представление

var rootView:CompositeView = new RootNodeView(model,controller, this.stage);



// добавление дочерних Представлений

rootView.add(new CharCodeLeafView(model));

rootView.add(new AsciiCharLeafView(model));



// подписка на получение уведомлений от Модели

model.addEventListener(Event.CHANGE, rootView.update);

Заметьте, что только корневое Представление регистрируется у Модели для получения событий обновления. Это объясняется тем, что корневое Представление является составным, и событие пробегает по каждой из его веток. Теперь, когда нажимается клавиша на клавиатуре, одна «дочка» выведет код символа, а другая — соотвествующий ASCII-символ. Такая много-компонентная структура будет работать при увеличении числа компонентов так же хорошо, как и в этом нашем простом минималистичном примере.

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


Основные преимущества шаблона MVC

Главная польза от применения шаблона MVC — это гибкость, которая упрощает построение приложений, имеющих пользовательский интерфейс. Шаблон разделяет Модель, Представление и Контроллер и прибегает к шаблонам Обозреватель, Стретегия и Компоновщик для их декомпозиции.

• MVC состоит из трех элементов, называемых Модель, Представление и Контроллер, которые распределяют участки ответственности в приложениях с графическим интерфейсом.
  
  
• Взаимоотношение между Моделями и Представлениями представляет собой выделение Конкретного Субъекта и Конкретного Обозревателя в шаблоне Обозреватель.
  
  
• Взаимоотношения между Представлениями и Контроллерами представляют собой Контекст и Конкретную Стратегию в шаблоне Стратегия.
  
  
• Множественные Представления могут регистрироваться в Модели.
  
  
• Представления могут быть вложенными с использованием шаблона Компоновщик для создания сложного пользовательского интерфейса, упрощая процесс обновления.

Продолжение следует...