Понятие View¶

View - абстракция представления¶

В терминах TrylogicFramework-а, View является единицей отображения. Так что же представляет из себя View на самом деле? Давайте посмотрим:

Для примера возьмём этот простой вид (для описания View так же используется MXML, хотя вы и можете делать это в Pure AS коде):

<?xml version="1.0"?>
<gui:ContainerBase xmlns:fx="http://ns.adobe.com/mxml/2009"
                           xmlns:gui="http://www.trylogic.ru/gui"
                           xmlns:trylogic="http://www.trylogic.ru/"
                           xmlns:s="library://ns.adobe.com/flex/spark">

        <gui:controllerClass>ru.trylogic.dummy.views.dummyApplicationView.DummyApplicationViewController</gui:controllerClass>

        <gui:eventMaps>
                <trylogic:EventMap source="{myButton}" type="tap" destination="{new Event('myButtonTapped')}" />
        </gui:eventMaps>

        <gui:states>
                <s:State id="defaultState" name="default" />
                <s:State id="anotherState" name="another" />
        </gui:states>

        <gui:Button id="myButton" x="100" y="100" y.another="200" />

</gui:ContainerBase>

Самое важное - это указать свойство controllerClass у View, ведь иначе TF не узнает, какой контроллер должен управлять этим видом, и будет использовать стандартный ViewController. Контроллер вида задаётся явно в виде класса. У одного вида может быть только один контроллер, и наоборот.

Связь с View его контроллер осуществляет с помощью трёх доступных методов:

Outlet-ы (в данном примере Button является Outlet-ом с идентификатором myButton )
Посредством наблюдения за Event-ами, которые вид диспатчит (в примере вид задиспачит событие с идентификатором myButtonTapped при возникновении события tap на кнопке myButton)
States (Состояния) (в нашем View объявленно два состояния с именами default и another )

Давайте рассмотрим эти методы более детально.

Outlets¶

Понятие аутлетов было взято создателями TF из мира iOS. Они позволяют связать определённую составляющую вида с свойством контроллера. На самом деле, со стороны View аутлеты есть не что иное, как обычные свойства. Но так же есть возможность использовать специальный тег Outlet, позволяющий мапить аутлеты с помощью биндинга:

<trylogic:Outlet id="myButtonFace" instance="{myButton.face}" />

EventMaps¶

Карты событий (EventMaps) - это механизм, дающий возможность проксировать одно событие, возникающее на source с типом type, на другое событие, которое будет задиспатчено относительно View.

Рассмотрим данный выше пример EventMap-а:

<trylogic:EventMap source="{myButton}" type="tap" destination="{new Event('myButtonTapped')}" />

Это - самый примитивный, но чаще всего используемый вариант. Когда у объекта myButton произойдёт событие tap, то View задиспатчит событие myButtonTapped и контроллер (либо другой View) сможет об этом узнать.

States¶

States (состояния) - это очень удобный концепт, позволяющий Вам менять параметры View в зависимости от его текущего состояния. В TF используется модель States от Flex 4 (важно понимать, что TF не наследуется от Flex-а и не тянет за собой ничего лишнего).

Пример объявленных состояний:

<gui:states>
        <s:State id="defaultState" name="default" />
        <s:State id="anotherState" name="another" />
</gui:states>

... и их использования

<gui:Button id="myButton" x="100" y="100" y.another="200" />

Обратите внимание на то, как объявленно свойство y у кнопки myButton. Запись y.another означает “значение y в состоянии another”. Когда у свойства не указано состояние, то это означает, что значение будет использовано всегда, когда не указано другое для другого состояния.

Face - абстракция отображения¶

Face - это лицо Вашего вида. Вот представьте, у Вас есть лицо. Есть его описание (2 глаза, нос, рот, уши, если брать стандартный комплект:)) - это View. А есть то, как они выглядят - нос, к примеру, картошкой, а глаза - карие. Так и Face у View отвечает за его отображение в зависимости от заданных параметров.

Важный момент тут в том, что Ваше лицо может быть представлено не только в виде кожи, но и, например, в виде рисунка. При этом описание Вашего лица не меняется, а меняется лишь способ отображения. Так и в TF, Вы можете не меняя описания Вашей View менять способ отображения, к примеру, с нативного DisplayList-а на Starling, и наоборот. Если компоненты, которые Вы используете, написаны правильно, то Вы не заметите никакой визуальной разницы, метод отрисовки будет скрыт от Ваших глаз.

У каждой View есть функция

function get face() : IDisplayObject;

объявленная в интерфейсе tl.view.IView, которая вернёт *платформозависимый* объект отображения для текущей системы отрисовки.