[UB] Документация по Unbound framework

[MedvedevTD]

Байндинги

Байндинги - это директивы, назначающие элементам различные поведения: синхронизация с моделью данных, показ тултипа, драг-н-дроп и т.п..

Объявляются байндинги так: (bind %binding_name% "binding_expression1; binding_expression2; ..."). Синтаксис binding expressions - это ограниченное подмножество синтаксиса JS / AS3 - поддерживаются строки, числа, true, false, null, арифметические, логические операции, операторы сравнения, обращения к элементам массива через [], обращения к свойствам объекта через . и тернарный оператор. Вычисляются binding expressions относительно текущего scope (т.е. "player.name" на самом деле есть "scope.player.name").

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

public class NewWindowController extends UbController {        public var gameInfoHolder:GameInfoHolder;           override public function init(... params):void     {         scope.playerName = ... // grab player name from GameInfoHolder     }    }

Для того, чтобы контроллер не обрезался линкером (or whatever this thing is called in SWF's compilation), в главном классе окна следует импортировать его и объявить приватную переменную соответствующего типа.

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

Контроллер можно объявить так:

(bind controller "lesta.dialogs.new_window.NewWindowController; arg1; arg2; ...")

Вычисленные arg1, arg2, arg3, ... передаются в метод init контроллера.

 

Часто используемые контроллеры

Скрытый текст

EntitySingletonController

Создаёт в scope ссылку на синглтон (объект с данными, существующий в единственном экземпляре) из GameInfoHolder и обновляет scope при обновлении данных в этом синглтоне.

Единственный аргумент - id синглтона.

Пример использования:

(bind controller "lesta.dialogs.controllers.EntitySingletonController; 'serverState' ")

После чего в scope станет доступно свойство serverState - это объект класса lesta.structs.ServerState с единственным свойством "hasFreePreBattles".

 

Иногда в одном и том же элементе данные из синглтона могут требоваться не всегда. Например, в кнопке выбора типа боя требуются данные об отряде только если это кнопка тренировочной комнаты. Она должна быть недоступна если игрок в отряде. Состояние кнопок случайного и кооперативного боя от отряда не зависит. В этом случае вместо id синглтона можно передать null - тогда импорта данных и подписки на их обновление не произойдёт.

В случае с кнопкой выбора боя это будет выглядеть так:

(bind controller "lesta.dialogs.controllers.EntitySingletonController; type == BattleTypes.TRAINING_BATTLE ? 'divisionData' : null")

 

CollectionController

Создаёт в scope ссылку на коллекцию или один элемент коллекции из GameInfoHolder и обновляет scope при обновлении этой коллекции. Поведение зависит от количества переданных аргументов.

Импорт всей коллекции.

(bind controller "lesta.dialogs.controllers.CollectionController; 'collection_id'; 'scope_key'")

Создаёт в scope свойство "scope_key" со значением в виде массива всех элементов коллекции 'collection_id'.

Импорт одного элемента коллекции.

(bind controller "lesta.dialogs.controllers.CollectionController; 'collection_id'; 'element_id'; 'scope_key'")

Создаёт в scope свойство "scope_key" со значением в виде элемента с id element_id' из коллекции 'collection_id'.

Фильтрация коллекции.

(bind controller "lesta.dialogs.controllers.CollectionController; 'collection_id'; 'property_name'; 'required_value'; 'scope_key'")

Создаёт в scope свойство "scope_key" со значением в виде массива тех элементов коллекции 'collection_id', у которых свойство 'property_name' равно 'required_value'

 

[MatroseFuchs]

Список доступных байндингов

 

UbChildBinding

Скрытый текст

(bind child "someExpression; 'elementName0'; 'elementName1'; ..."

Определяет дочерний display object блока. Выражение someExpression (обычно это просто поле) вычисляет относительно скоупа индекс. По индексу из elementClass0, elementClass1, etc (не забудьте заключить имена в одинарные кавычки!) выбирается класс сына, после чего тот инстанциируется фреймворком и прикрепляется к элементу. В байндингах сына становятся доступными свойства скоупа родителя посредством обращения к $parent.

Вторым параметром также можно указать объект с параметрами для дочерних элементов:

(bind child "someExpression; {scopeKey : value, scopeKey : value}; 'elementName0'; 'elementName1'; ..."

Иногда выбирать дочерний элемент удобнее по строке, а не по индексу. В этом случае последним (вторым или третьим) параметром можно указать объект, задающий соответствия строка - элемент:

(bind child "someExpression; {scopeKey : value, scopeKey : value}; {key1: 'elementName0', key2: 'elementName1'}")

или

(bind child "someExpression; {key1: 'elementName0', key2: 'elementName0'}")

Обратите внимание, что ключи всегда указываются без кавычек, а имена элементов, если они не в какой-то переменной записаны - в кавычках. Например:

(bind child "reward.type; {subtype : reward.subtype, amount : reward.amount}; {Ship: 'ShipRewardElement', Exterior: 'ExteriorRewardElement', Resource: 'ResourceRewardElement'}")

Где в reward.type лежит строка "Ship", "Exterior" или "Resource"

 

UbInstanceBinding

Скрытый текст

(bind instance "'ElementClass'; someExpression")

Определяет дочерний display object блока, если имеются данные для его отображения. Сначала вычисляется someExpression относительно скоупа, затем, если результат не равен null, то ElementClass инстанциируется фреймворком и прикрепляется к элементу. В байндингах сына становятся доступными свойства скоупа родителя посредством обращения к $parent.

 

UbEventBinding

Скрытый текст

(bind event "'eventName'; method; arg1;arg2...")

При излучении элементом события eventName (не забудьте заключить в одинарные кавычки!) вызывается method, импортированный из контроллера, ему передаются аргументы event, arg1, arg2, ... .

Если названного метода в скоупе не обнаружится, будет сделана попытка вызвать метод самого DisplayObject'a. Например:

(bind event "'startHide'; 'gotoAndStop'; 'hide'")

В этом случае имя метода нужно заключать в одинарные кавычки. Передаваться будут только заданные аргументы (arg1, arg2, ... )

Если не удастся вызвать ни один из методов, в лог будет выведено предупреждение: 
[WARNING] wrong usage of 'bind event'

 

UbSyncBinding

Скрытый текст

(bind sync "someProperty; somePropertyNotifyAboutChangeEvent; someExpression")

Синхронизирует свойство someProperty элемента с выражением someExpression (должно быть lvalue). Т.е. при изменении someProperty изменяется someValue и наоборот. При изменении someProperty элемент должен бросать событие типа somePropertyNotifyAboutChangeEvent.

 

UbRepeatBinding

Скрытый текст

(bind repeat "dataList; 'itemRenderer'; {scopeKey : value}; _revert")

Для каждого элемента массива dataList инстанциирует элемент типа itemRenderer, для него создается дочерний скоуп (в нем доступно свойство $index) и прикрепляет его к блоку.
Если в качестве dataList передаётся не массив, а объект, то его поля (исключая вложенные объекты) будут доступны через ключи. В случае, если объект — сущность (entity), то в scope будет доступен её id.

Вместо массива dataList можно и передать и число, обозначающее сколько элементов надо создать. У этих элементов тоже будет свойство $index.

{scopeKey : value} -  скоуп каждого объекта можно добавить набор параметров

_revert[true/false] - указывает порядок отображения элементов (прямой/обратный).По умолчанию false - прямой.

Важно: если какой-то из элементов массива - null, то биндинг всё равно для него создаст элемент. Лучше не передавать ему массив с пустыми элементами если вы не уверены что это единственно верное решение.

 

UbGeneratorBinding

Скрытый текст

Для каждого элемента массива dataList инстанциирует элемент типа itemRenderer.

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

Элементы при этом отсортированы согласно sortArray.

(bind generator "dataList; 'itemRenderer'; {scopeKey : value}; sortArray; sortField")

Дополнительные параметры(опционально):

• {scopeKey : value}  -  в скоуп каждого объекта можно добавить набор параметров

• sortArray - отсортированный массив или массив, который нужно отсортировать(если задано sortField)

• sortField - поле, по которому сортируется массив sortArray.

 

UbDraggableBinding

Скрытый текст

(bind draggable "elementName")

Текущий элемент становится перетаскиваемым. Драг-н-дроп работает по нажатию на элемент-потомок с именем elementName (не забудьте заключить в одинарные кавычки!). В верстке свойство name для блока можно задать тегом (name "value").

 

UbClikListBinding

Скрытый текст

(bind clikList "someExpression")

Синхронизирует кликовский список с выражением someExpression (обычно - просто поле, содержащее массив). Работает только для mc, в теге params должно быть задано свойство unboundClassName - имя элемента-строки списка.

(mc player_details_stats_list     (params (rowHeight 20) (unboundClassName TeamResultStatRow) (scrollBar GreyScrollbar))     (bind clikList "theirDetails.player.stats"))

 

UbStyleBinding

Скрытый текст

(bind style "'styleName'; expression")

Синхронизирует значение свойства стиля styleName (одинарные кавычки!) с expression.

 

UbStyleClassBinding

Скрытый текст

(bind class "'className'")

Применяет к элементу класс стилей className (одинарные кавычки!), и, если до этого className был иным, то снимает с элемента предыдущий className класс.

 

UbAppearBinding

Скрытый текст

(bind appear "'eventName'; duration; delay; {start props}; {finish props}")

При добавлении объекта на сцену проигрывает твин с заданными параметрами. Официально поддерживаются: alpha, top, left, scaleX, scaleY, rotation. Для mc вместо top и left используйте x и y (нет, это не издевательство, а суровая правда жизни).

 

UbTransitionBinding

Скрытый текст

(bind transition "someExpression; duration; {start props}; {finish props}; ({start props};) (easing;) (delay)")

При выполнении условия проигрывает твин с заданными параметрами, где someExpression — событие или выражение, которое вычисляется в true, duration — длительность перехода в секундах, {props} — стиль CSS, по которому идёт анимация (например, alpha или top).
Необязательные параметры: easing — тип функции перехода, по умолчанию 0, т.е. линейный переход. Возможные значения: 1 (замедление анимации к концу), 2 (ускорение), 3 (сначала ускоряется, затем замедляется). Любое значение кроме этих приравнивается к 0.

 

UbTooltipBinding

Скрытый текст

(bind tooltip "'TooltipElementName'; {tooltip scope}; tooltip_behaviour_id")

Привязывает к объекту тултип.

• 
  TooltipElementName: объект, который будет отображаться в качестве тултипа

• {block scope} (опциональный): передаёт данные в scope объекта BlockName
• tooltip_behaviour_id (опциональный): integer, задаёт вариант поведения тултипа.

 

UbSequenceBinding

Скрытый текст

(bind sequence "dataList; 'itemRenderer'; itemLifeTime; itemHideTime; gap")

Для каждого элемента массива dataList начиная с нулевого создает элемент с id=itemRenderer, для него создается дочерний скоуп (в нем доступно свойство $index) и прикрепляет его к блоку. Созданному элементу выставляется show=true, по прошествии itemLifeTime секунд выставляется show=false, а еще через itemHideTime секунд элемент удаляется и добавляется следующий. Опциональный параметр gap задает задержку между удалением предыдущего и добавлением следующего. По умолчанию - 0, то есть следующий элемент будет добавлен сразу после удаления предыдущего. Параметр gap может быть и отрицательным, тогда новый элемент будет добавлен за gap секунд до удаления предыдущего.

 

UbPropertyBinding

Скрытый текст

Байндинги с отличным от вышеуказанных свойством name считаются property bindings.

(bind some_prop "someExpression")

Свойство some_prop (например, visible) объекта односторонне синхронизируется с выражением someExpression (чаще всего - просто поле), т.е. изменения someExpression будут отражены в some_prop.

С помощью property binding также можно передавать значения выражений value в метод компонента (например, gotoAndStop) - для этого достаточно добавить ! к аттрибуту name.

(bind gotoAndStop! "state")

(bind twoArgumentsMethod! "arg1; arg2")

 

UBVariablesBinding

Скрытый текст

Байндинг создания и присвоения значения свойств текущего scope. 

(bind var "{propertyName: propertyValue, propertyName1: propertyValue1}")

копирует все свойства объекта, описанного в выражении в scope

 

UbCatchEventBinding

Скрытый текст

Байндинг создания и присвоения значения свойств текущего scope после получения события от scope или текущего блока. 

(bind catch "'event_name';{propertyName: propertyValue, propertyName1: propertyValue1}") - данные для скоупа передаются как Object (bind catch "'event_name';[propertyName, propertyValue, propertyName1, propertyValue1]") - данные для скоупа передаются как Array

при "поимке" события event_name копирует все свойства объекта, описанного в выражении в scope

 

UbDispatchBinding

Скрытый текст

Байндинг реакции на событие. 

(bind dispatch "'listen_event'; 'dispatch_event'; arguments; direction; delay")

Слушает события с именем listen_event. Это может быть как событие scope, так и событие DisplayObject (например, клик мышью). При наступлении события диспатчит в scope событие с именем dispatch_event с аргументами arguments (это должен быть массив). direction и delay - необязательные параметры. direction указывает направление отправляемого события: 0 — пойдёт вверх по родителям, 1 — вниз по детям, 2 — останется в текущем скоупе. По умолчанию 0. delay - задержка перед отправкой события в секундах. По умолчанию задержки нет, события уходят сразу.

Пример использования:

(bind dispatch "'click'; 'gotoReward'; [type, subtype]; 0; 1.2")

 

UbDispatchDelayResetBinding

Скрытый текст

Байндинг реакции на событие, при наступлении которого сбрасывается единственный таймер delay и стартует заново.

(bind dispatchDelayReset "'listen_event'; 'dispatch_event'; arguments; direction; delay")

В остальном идентичен UbDispatchBinding.

 

UbChangeDispatchBinding

Скрытый текст

Байндинг реакции на изменение свойства скоупа. 

(bind changeDispatch "property; 'dispatch_event'; arguments; direction; condition")

Слушает изменения property в скоупе. При изменении диспатчит в scope событие с именем dispatch_event с аргументами arguments (это должен быть массив) и задержкой в timeout секунд. Direction и condition — необязательные параметры. Direction указывает направление отправляемого события; если false, то пойдёт вверх по родителям, если true — вниз по детям. По умолчанию false. Condition — условие, по которому диспатчится событие. Оно сравнивается с property.

Пример использования:

(bind changeDispatch "contactsInfotipIsVIsible; 'sendClearSearch'; {}; true; false")

Здесь по изменению поля contactsInfotipIsVIsible, если оно равно false, кидается событие sendClearSearch

 

UbCountdownBinding

Скрытый текст

Байндинг для визуализации текста обратного отсчёта.

(bind countdown "server_time_stamp; 'scope_field'; format")

Байндинг вычисляет время, оставшееся до момента server_time_stamp. Значение server_time_stamp - момент в серверном времени, в секундах, в формате Unix Timestamp. Байндинг пишет текущее значение отсчёта в поле scope_field строкой, в формате из параметра format. Если format не указан, пишет в HH:MM:SS.

Поддерживаемые форматы (регистр важен):

• yyyy - год полностью

• yy - год, последние 2 цифры

• M - месяц, (1 или 2 цифры)

• MM - месяц, всегда 2 цифры

• d - день, (1 или 2 цифры)

• dd - день, всегда 2 цифры

• H - часы, (1 или 2 цифры)

• HH -часы, всегда 2 цифры

• m - минуты, (1 или 2 цифры)

• mm - минуты, всегда 2 цифры

• s - секунды, (1 или 2 цифры)

• ss - секунды, всегда 2 цифры

Также в качестве параметра format можно указать 'HIGHEST'. Тогда  будет выводить только одно число разницы во времени, наивысшее начиная с месяца, с округлением в ближайшую сторону, с указанием размерности. Например, если осталось 4 дня, 21 час, 10 минут, то выведет "5 дн.", если 2 часа 20 минут - то "2 ч.", если 45 минут 40 секунд - то "46 мин."

Байндинг учитывает разницу серверного и клиентского времени. Для стабильной работы НЕ требуются какие либо апдейты. 

Не рекомендуется использовать (bind text "scope_field") для отображения строки обратного отсчёта, так как это приводит к ежесекундным обновлениям трансформаций блоков (часто лавинообразным) и трате ресурса производительности. По возможности следует использовать  (bind pureText "scope_field") - это позволяет установить значения текстового поля, избежав обновления трансформаций блока. 

 

UbClockBinding

Скрытый текст

Байндинг системного времени.

(bind clock "'scopeFieldName'; timeFormat")

Записывает значение системного времени в формате timeFormat в поле scopeFieldName текущего объекта scope с интервалом в 1 секунду.

scopeFieldName - строка, задающая имя поля, в которое будет записываться значение текущего времени, например, 'currentSystemTimeText'

timeFormat - строка, задающая формат вывода времени, например, 'hh:mm:ss',

 

UbContainsBinding

Скрытый текст

Проверяет, содержит ли массив или словарь элементы, соответствующие заданному условию.

(bind contains "collection; condition; 'resultFieldName'; returnIndex; listOfPropertiesToView")

collection - массив или словарь, в котором осуществляется поиск

condition - условие

resultFieldName - строка, задающая имя поля, в которое будет записан результат

 returnIndex - необязательный четвёртый параметр. По-умолчанию false. Если передать true - то вместо true/false будет записывать в scope индекс первого удовлетворяющего требованиям элемента.

 

Байндинг производит обход элементов collection и проверяет выполнение условия condition на каждом элементе. Если условие принимает значение true хотя бы на одном элементе, то в поле resultFieldName записывается значение true , в противном случае -  false.

Обратиться к текущему элементу итерации можно посредством идентификатора $item. 

(bind controller "lesta.dialogs.controllers.EntitySingletonController; 'exteriorConfigSingleton'") ... # Проверяем, содержит ли словарь _exteriors вечные камуфляжи. Результат проверки записываем в поле _hasInstalledPermoflages текущего объекта scope. # _exteriors содержит элементы PlayerShipInfoExterior вида {id:String, goldAutorecharge:Boolean} # exteriorConfigSingleton.config содержит конфигурации экстерьеров ExteriorConfig вида {..., type:String, ..., isPermanent:Boolean, ...} # $item указывает на текущий элемент PlayerShipInfoExterior # по $item.id находим конфигурацию экстерьера в exteriorConfigSingleton.config и проверяем значения полей конфигурации type и isPermanent (bind contains "_exteriors; (exteriorConfigSingleton.config[$item.id].type == ExteriorTypes.CAMOUFLAGE) && (exteriorConfigSingleton.config[$item.id].isPermanent); '_hasInstalledPermoflages'")

 

UbFileBinding

Скрытый текст

Загружает текст из внешнего файла и записывает его в scope.

(bind file " 'myFile'; '../../someTextFile.txt' ")

Первый параметр - имя свойства в scope,  в которое надо записать содержимое файла. Второй - путь к файлу. Путь указывается относительно папки с swf (wows/game/res/gui/flash/)

 

UbEventSequenceBinding

Скрытый текст

Слушает событие в scope и в ответ на него диспатчит события из заданной очереди. Если событий в очереди больше не осталось - диспатчит событие о том, что очередь пуста.

(bind eventSequence "['event1', 'event2', 'event3', 'event4']; 'give'; 'done'; direction")

Первый параметр - массив событий. Второй - событие, которое надо слушать. Третий,  необязательный параметр - событие, которое надо отправить когда очередь события из массива кончатся. В данном примере биндинг будет слушать событие 'give' и при первом его наступлении испустит 'event1', при втором - 'event2' и так далее. При пятом и последующих событиях 'give' испустит 'done'. Если событию 'give' передать объект с аргументами, то этот же объект уйдёт и в испускаемое событие. Четвёртый необязательный параметр, direction - направление отправляемого события. 0, 1 или 2 если нужно чтобы событие ушло вверх по родителям, вниз по детям, или распространилось только на сам scope. Либо true/false аналогично UbDispatchBinding

 

UbTimeFormatBinding

Скрытый текст

Форматирует timestamp с учетом формата и таймзоны

 

(bind timeFormat "timeStamp; formatString; scopeName; useLocalTime")

 

Конвертирует timeStamp в дату в формате formatString и записывает в скоуп готовую строку. 

Если задан useLocalTime - использует локальное время, иначе использует GMT время

Выводит таймзону в скоуп в поле scopeName + "_TimeZone"

Attention: если данные поступают как количество секунд с начала суток(пример - праймтайм командных боев) и отображаются в виде hh:mm, то для правильного пересчета в UTC к этому значению нужно прибавить количество секунд в сутках(86400)

 

UbRestrictFeedbackBinding

Скрытый текст

Информирует о соответствии вводимых в текстовое поле символов заданному регулярному выражению.

 

(bind restrictFeedback "regexp; 'isWrongSymbol_scopeFieldName'")

Проверяет соответствие вводимого символа регулярному выражению regexp и записывает результат проверки в скоуп в переменную isWrongSymbol_scopeFieldName.

Если соответствует регулярному выражению, то результат false, иначе - true.

 

UbIndexOfBinding

Скрытый текст

Проходится по исходному массиву, находит первое совпадение элемента по заданным полям и значениям и записывает индекс элемента в целевое поле скоупа.
Совпадение должно быть по всем полям и значениям, иначе при отсутствии совпадений в исходном массиве в целевое поле записывается -1.
Если отсутсвует массив или объект с полями или имя в скоупе, куда записывать индекс, то рассчет и запись индекса в скоуп не производится.

(bind indexOf "sourceScopeName; targetScopeName; {key1: value1, key2: scopeValue2, ...}")

Example

(bind indexOf "personalTasksCollection; currentIndex; {'isPersonalTask': true, 'isDaily': false }")

 

UBAccountLevelBinding

Скрытый текст

 

(bind feature "param; event")

Связывает элемент интерфейса с ревардами\анлоками, получаемыми при достижении определенного уровня

• param - если элемент добавляется посредством repeat binding, то поле в data, обозначающее номер фичи для этого элемента, иначе номер фичи
• event - событие, по которому из элеемента удаляеся значок isNew

Примеры (bind feature "3; 'click'") - обычный элемент, (bind feature "'featureId'; 'click'") - элемент списка

Фичи и их индексы:

 

BATTLE_TUTORIAL  = 0x00000001 BATTLE_COOP      = 0x00000002 feature_1 BATTLE_JUNIOR    = 0x00000004 BATTLE_SENIOR    = 0x00000008 feature_3 RESEARCH_USE     = 0x00000010 FREE_EXP_USE     = 0x00000020 feature_5 FREE_EXP_TRANSIT = 0x00000040 SKILL_TREE_USE   = 0x00000080 DAILYQUESTS_USE  = 0x00000100 feature_8 SSE_USE          = 0x00000200 feature_9 GOLD_USE         = 0x00000400 CHAT_USE         = 0x00000800 MODERNIZATIONS   = 0x00001000 feature_12 CREWS            = 0x00002000 feature_13 EXT_SIGNALS      = 0x00004000 feature_14 EXT_CAMOUFLAGE   = 0x00008000 feature_15 RANK_BATTLES     = 0x00010000 feature_16 NATIONS_TREE     = 0x00020000 feature_17 SSE              = 0x00040000 CLUBS            = 0x00080000 feature_19 ARMOR_VISIBLE    = 0x00100000

 

 

SFMRequestBinding и SFMActionBinding

Скрытый текст

Передают событие с заданными параметрами в SFM. Различие в том, что SFM передаёт событие от action в питон незамедлительно,

а request вызывает изменение состояния SFM, в результате которого принимается решение о передаче в питон события и его данных.

(bind request "'event_name';'action_name';{propertyName: propertyValue, propertyName1: propertyValue1}")

(bind action  "'event_name';'action_name';{propertyName: propertyValue, propertyName1: propertyValue1}")

event_name - событие, которого ждёт байндинг 

action_name - событие, которое передаётся в SFM 

{} - объект, который передаётся в SFM вместе с событием

 

FocusBinding

Скрытый текст

(bind focus "tabIndex;defaultFocused")

Делает CLIK элемент focusable. Обеспечивание правильную работу фокуса в случае, когда несколько окон на экране. Фокус работает только на верхнем окне.

tabIndex - порядковый номер при tab-переходе фокуса

defaultFocused - нужно ли ставить элемент в состояние focused при открытии окна

Примечание: все элементы CLIK по умолчанию не focusable, только с помощью этого биндинга делайте элементы focusable.

 

InputMappingBinding

Скрытый текст

(bind input)

По клику на блок, кидает в SFM событие "gui.block_name" где block_name заменяется на имя блока.
Внимание: для корректной работы обязатльно задать (name имя_блока)

 

UbSubstituteBinding

Скрытый текст

(bind substitute "<imageOffset>; <substitutionMap>; <sourceText>; <prefix>")

Биндинг который заменяет подстроки на картинки в текстовых полях. 

Параметры:

ВАЖНО В случае использования биндинга запрещено использовать bind text.

ВАЖНО На один текстовый блок может быть только один bind substitute

<imageOffset> - смещение картинки по вертикали относительно бейзлайна текста;

<substitutionMap> - необязательный параметр в виде 

{     'key1':'icon_bitmap_1',     'key2':'icon_bitmap_2' }

задающий соответствие подстроки в тексте определенной картинке

ВАЖНО Для substitution могут быть использованы ТОЛЬКО Bitmap - статические картинки. Попытка использовать Shape или MovieClip будет приводить к падению.

<soureText> - исходный текст, в который будут подставляться картинки.

<prefix> - строка, которая добавляется в конец тегов командмаппинга перед получением картинки по ключу.

Примеры:

Заменить все упоминания кнопок на картинки, со смещением 5 по вертикали:

(bind substitute "5; null; 'Press [KEY_LEFTMOUSE]'")

Подставить вместо текста "[DOUBLECLK]" иконку двойного нажатия мышкой

(bind substitute "5; {'[DOUBLECLK]':'[LEFTMOUSE_DOUBLE]'}; _externalText")

 

UbSubstituteBinding

Скрытый текст

(bind soundOn "event; sound_name[; set_name]")

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

• event - событие, по которому должен проигрываться звук;
• sound_name - имя звука из пресета;
• set_name- имя soundSet, из которого выбирается звук, по умолчанию используется soundSet из текущего компонента если он UbBlock. Параметр является необязательным только если биндинг относится к UbBlock, иначе является обязательным и будет вызывать падения если параметр не задан;

Имена звуков, которые вызываются автоматически по событиям интерфейса:

Sound	Action	UIComponent	UIButton	UbBlock
State события
show	Visible -> true	Y	Y	Y
hide	Visible -> false	Y	Y	Y
Мышиные события
out	mouse out		Y	Y
click	mouse button up over control		Y	Y
over	mouse over		Y	Y
press	mouse button down		Y	Y
select	custom logic		Y
unselect	custom logic		Y
Прочие события
press_hotkey	(hotkey manager)
release_hotkey	(hotkey manager)
list_expend	(CLIK dropdown menu)
index_change	(CLIK list, dropdown menu)
change	(CLIK slider, textinput)
focused	(FocusHandler)	Y	Y
scroll	(JellyScrollbar, Scrollindicator)
enter	(FocusHandler textInput)

Разница между press и click в том что press проигрывается при нажатии мыши над контролом, а click - при отпускании.

Доступные soundSet:

• default_component

• default_button, hard_button, pause_login

• default_checkbox

• default_dropmenu

• default_list

• default_textinput, hard_textinput

• default_listitem

• default_listitem

• dropmenu_button

• weapon_control_button

Биндинг работает в связке с (bind soundSet) и (bind enabled).

(bind soundSet 'preset_name')

устанавливает soundSet значение в строчку 'preset_name'

ВАЖНО По умолчанию soundSet установлен в пустую строку, никаких звуков не издает, и не подписан ни на какие мышиные события. 

ВАЖНО При установке soundSet UbBlock подписывается на 5 мышиных событий: ROLL_OVER, ROLL_OUT, MOUSE_DOWN, CLICK, DOUBLE_CLICK что может и будет сказываться на производительности, если таких блоков достаточно много.

примечание В случае когда у UbBlock нужно только одно событие, лучше использовать (bind soundOn).

(bind enabled "condition")

устанавливает значение enabled (true/false) для включения/выключения событий по click/press.

 

DesignerCollectionBinding

Скрытый текст

Представляет собой байндинг, позволяющий техартистам выполнять над коллекциями операции сортировки и фильтрации.

На вход принимает либо датахабовскую коллекцию, либо такую же дизайнерскую коллекцию (которые нужно объявить перед использованием). Есть возможность расширить класс принимаемых коллекций, дописав код в actionscript

 

(bind collectionDesign "'DES_' + parentCollectionNameInScope; designCollectionNameInScope; filterObject")

 

filterObject это объект,  состоящий из 3 полей:

• filter - функция, содержащая переменные из скоупа, константы и $entity - элемент коллекции. Пример:

$entity.crew.nationIndex + $entity.crew.level >= maxLevel + 5

• sort - список полей у энтити, по которым идет сортировка
• sortOrder - список параметров сортировки - SortType.DESCENDING - обратная сортировка,  SortType.CASEINTESITIVE - обратная сортировка,  0 - отсутствие флага

Полный пример:

(bind collectionDesign "'DES_' + someScopeName; designCollectionNameInScope; {  'filter':$entity.crew.nationIndex + $entity.crew.level >= maxLevel + 5,                                                                                 'sort':['crew.nationIndex', 'crew.level', 'crew.name'],                                                                                 'sortOrder':[SortType.DESCENDING, 0, SortType.CASEINTESITIVE]}")

Поля в объекте filter могут отсутствовать, то есть если нужна только сортировка, то поле 'filter' пропускается.

Если источник - датахабовская коллекция - не является сортировкой или фильтрацией, а зависит только от компонента, то можно использовать replace вида

DESIGN_COLLECTION_COMPONENT("CC.crew", "'crewsCollection'",  "{'filter':!$entity.crew.isHistory, 'sort':['crew.nationIndex', 'crew.recentIndex', 'crew.level']}")

 

ConcatBinding

Скрытый текст

Представляет собой байндинг, позволяющий объединять несколько  коллекций

 

(bind concat "childCollectionNameInScope; [parentCollection1,..., parentCollectionN]")

 

ClipboardBinding

Скрытый текст

Копирует строку из скоупа в буфер по какому-то событию на момент события

 

(bind clipboard "'click'; scopeVar")

 

ColorTransformBinding

Скрытый текст

Применяет цветовую трансформацию объекта по правилу:

• Новое значение красного канала = (старое значение красного канала * redMultiplier) + redOffset
• Новое значение зелёного канала = (старое значение зелёного канала * greenMultiplier) + greenOffset
• Новое значение синего канала = (старое значение синего канала * blueMultiplier) + blueOffset
• Новое значение альфа-канала = (старое значение альфа-канала * alphaMultiplier) + alphaOffset

 

(bind colorTransform "{                        redMultiplier:1,                        greenMultiplier:1,                        blueMultiplier:1,                        alphaMultiplier:1,                        redOffset:0,                        greenOffset:0,                        blueOffset:0,                        alphaOffset:0   }")

 

SliceBinding

Скрытый текст

Позволяет разбивать коллекцию на части, создаёт срезы коллекции.

 

(bind slice "'outputCollectionNameInScope'; sourceCollectionNameInScope; startIndex; endIndex")

• outputCollectionNameInScope - Имя свойства в scope, куда запишется результат.
• sourceCollectionNameInScope - Коллекция, из которой требуется выделить часть. Если коллекция из datahub, то нужно указывать имя в формате DES_collectionName.
• startIndex - Число, указывающее на индекс начальной позиции среза. По умолчанию имеет значение 0.

Если startIndex — отрицательное число, начальной позицией становится конец массива, последнему элементу которого присваивается позиция «-1».

• endIndex - Число, указывающее на индекс конечной позиции среза. Если этот параметр пропустить, срез включает все элементы от начальной позиции до конца массива.

Если endIndex — отрицательное число, конечная позиция указывается с конца массива, последнему элементу которого присваивается позиция «-1».

 

Example:

(bind collectionDH "CC.ownShip; 'playerShips'")

(bind slice "'sample1'; DES_playerShips; 0; 4")     # срез коллекции playerShips, состоящий из элементов playerShips[0], playerShips[1], playerShips[2], playerShips[3]

(bind slice "'sample2'; sample1; -1")               # срез коллекции sample1, состоящий из одного последнего элемента sample1[sample1.length - 1]

(bind slice "'sample3'; sample1")                   # копия коллекции sample1

 

ResourceBinding

Скрытый текст

Загружает внешние ресурсы через ResourceLoadingDelegator.

 

(bind resource "videoURL; scopeName; scopeEvent")

• videoURL - путь к ресурсу
• scopeName - имя в scope, в которое надо записать id ресурса
• scopeEvent (необязательный) - имя события, которое надо отправить по окончании загрузки. Вместе с событием придёт объект с единственным полем success со значение true или false в зависимости от того успешно ли прошла загрузка

Example:

(bind resource "'./gui/video/level_up.usm'; 'levelUpResourceId'; 'videoReady'")

 

entityDH

Скрытый текст

Биндинг, позволяющий достать сущность в компоненте по id в массиве.

Пример: 

(bind entityDH "'campaignGoalEntity'; goalEntityId")

 

firstEntityDH

Скрытый текст

Биндинг, позволяющий достать первую и единственную сущность в компоненте. 

Пример: 

(bind firstEntityDH "'resourceEntity'; CC.accountResource")

 

 

primaryEntityDH 

Скрытый текст

Биндинг, позволяющий достать сущность в компоненте по primary key (если это позволяет компонент)

Для этого необходимо, чтобы было прописано в Components.xml  pk="true

Пример: 

<property  name="id"  type="Integer" pk="true"/>

Пример: 

(bind primaryEntityDH "'playerVoiceChatEntity'; CC.playerVoiceState; pureName")

 

DHCollectionGeneratorBinding

Скрытый текст

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

 

(bind generatorDH "DataHubCollectionName; 'ItemRenderer'; 'sortBy'; {propertyName: propertyValue, ...}")

где:

• DataHubCollectionName — имя коллекции в DataHub;
• ItemRenderer — имя класса, который будет использоваться для отображения (аналогично UbRepeatBinding);
• sortBy — поле, по которому данные должны быть отсортированы. Если сортироввка не требуется, нужно передать пустую строку '';
• {propertyName: propertyValue, ...} — Набор переменных, которые будут прокинуты в область видимости (scope). Может быть пустым.

 

Рекомендуется использовать, если количество выводимых элементов может быть любым (больше 10). Хороший пример — список повторов:

(bind generatorDH "CC.replayMetadata; 'ReplaysTableRow'; ''; {_data: data, selectedTabIndex: selectedTabIndex}")

 

Обязательное условие!

Этот биндинг должен быть помещён в контейнер, для которого обязательно должны быть заданы следующие стили:

(overflow scroll) (layout "<layout>") (wheelScrollSpeed 45) (itemWidth <number>px) (itemHeight <number>px)

где <layout> — один из описанных в пакете lesta.unbound.layout.measure.

 

По умолчанию, для обычного списка с вертикальной прокруткой можно использовать карусель:

(layout "lesta.unbound.layout.measure.CarouselLayout")

 

Если хотя бы один из этих стилей не задать, генератор не сработает (данные не будут отображены).

 

GSTimelineBinding

Скрытый текст

Запускает анимацию с помощью GreenSock TimelineMax: создаёт Timeline с твинами и управляет ими.

 

(bind timeline "startEvents;    timelineProps; tweensArray; (optional)timelineEvents; (optional)timelineSettings")

где:

• startEvents — события старта анимации. Можно задать тремя способами:
  • В виде строки:

    (bind timeline "'rollOver'; {}; [0.2, {colorMatrixFilter: {saturation: 1}}]") Анимация начнётся при срабатывании события с заданным именем.

  • В виде массива строк:

    (bind timeline "['addedToStage', 'rollOut'];    {}; [0.2, {colorMatrixFilter: {saturation: 0}}]") Анимация начнётся при срабатывании любого из заданных событий.

  • В виде объекта с соответствием "событие - функция":

    (bind timeline "{addedToStage: 'play', rollOver: ['reverse', 0], rollOut: ['play', [0]]};   {}; [0.2, {colorMatrixFilter: {index: 0, saturation: 0}}]; [] ")

• timelineProps — свойства таймлайна, те же, что можно указать в конструкторе TimelineMax по документации GreenSock.

  (bind timeline "'addedToStage';                 {repeat: -1, repeatDelay: 2, yoyo: true};                 [3, {x: 1000, radius:70, ease:Easing.Bounce.easeOut}, 5, {x: 1500, radius:20, ease:Easing.Bounce.easeIn}]             ") В числе параметров можно указывать и коллбеки: onStart, onUpdate, onComplete, onReverseComplete, onRepeat. В их значении указываем имена событий, которые должны быть отправлены при вызове соотвтествующих коллбеков.

• tweensArray - массив твинов, где идут чередуясь время твина и его параметры (то есть длина массива всегда чётная). Длительность указывается в секундах, параметры анимации - как для обычного твина GreenSock. Для изингов прокинуты гринсоковские константы.
• timelineEvents - необязательный параметр, задающий события, которые надо отправить в Scope при проигрывании какого-то места на таймлайне.

  (bind timeline "'addedToStage';                 {};                 [3, {x: 1000, radius:70, ease:Easing.Bounce.easeOut}, 5, {x: 1500, radius:20, ease:Easing.Bounce.easeIn}];                 [5, 'frameEvent1', {animState: 'A'}, 7, 'frameEvent2', {animState: 'C'}]             ") Это массив из чередующихся позиции, имени события и данных для события (то есть его длина кратна трём).

• timelineSettings - необязательный параметр, биндящий к свойствам scope свойства-сеттеры таймлайна, такие как delay, duration, paused, reversed, timeScale и totalDuration. Это объект из соответствий свойство таймлайна → имя в scope (строкой).

 

 

WowsResizeBinding

Скрытый текст

Реализует объект изменяемого размера (такое как окно чата в порту, например).

 

(bind resize "gripName;  directions; userPrefsWidthName; userPrefsHeightName; subSectionName")

• gripName - Имя дочернего клипа, при нажатии на который начинается перетаскивание
• directions - В какую сторону менять размер при перетаскивании. Строка с перечислением через запятую. Например,'down,right'или 'up,left'. По понятным причинам ресайзить одновременно в противоположные стороны (up, down или left, right) нельзя.
• userPrefsWidthName - Имя в userPrefs, под которым надо сохранить (или прочитать) ширину объекта.
• userPrefsHeightName - Имя в userPrefs, под которым надо сохранить (или прочитать) высоту объекта.
• subSectionName - Необязательный. Имя подсекции в указанных userPrefs.

 

 

UbPluralTextBinding

Скрытый текст

Применяет числительное в нужной словоформе для переданного числа.

 

(tf   (bind pluralText "'IDS_PL_PLAYERS_COUNT'; count") )

 

Применяется к текстовому полю, так как меняет свойство text у объекта, к которому привязано.

 

UbContextMenuBinding

Скрытый текст

Синтаксический сахар для UbTooltipBinding с поведением контекстного меню.

 

(bind menu "'ShipTreeMenu'; { shipId: shipId, _disableShipActions: _disableShipActions }")

 

UbWatchBinding

Скрытый текст

Записывает значение выражения в переменную в scope и обновляет её при изменении выражения.

 

(bind watch "'nameInScope'; (stageHeight - 124 - 62 - (10 + (stageHeight - 720) * 0.36))")

 

ActionIsDisplayBinding

Скрытый текст

Бросает событие action... в SFM при появлении и скрытии блока, к которому привязан биндинг.

 

(bind actionIsDisplay "actionName; ")

• actionName - имя события, которое надо отправить
• actionData - Необязательный. Данные, которые надо передать с событием

 

UbRepeatWithScopeHoldBinding

Скрытый текст

DEPRECATED — не рекомендуется использовать.
От обычного UbRepeatBinding отличается тем, что привязывает дочерние scope не к индексу элемента, а к id из данных в элементе, что позволяет при изменении сортировки сохранить привязку данных к определённому элементу.

 

(bind scopeHoldRepeat "array; elementName; idGetter; externalData")

• array - массив, по которому идёт repeat
• elementName - имя элемента Item Renderer'а
• idGetter - выражение, которое вернёт id скоупа из дочернего элемента массива
• externalData - Необязательный. Дополнительные данные в scope

 

UBServerTimeBinding

Скрытый текст

Кладёт в scope текущее серверное время (timestamp) в поле с именем serverTimeFieldName и, если указан необязательный параметр dayFieldName, кладёт номер дня недели в это поле.

 

(bind serverTime "serverTimeFieldName; dayFieldName")

 

UbFeatureCheckBinding

Скрытый текст

Проверяет доступна ли фича по уровню аккаунта и кладёт результат проверки в scope.

 

(bind levelToFeature "accountLevel; featureId; 'resultFieldName'")

• accountLevel - уровень аккаунта
• featureId - id фичи, например, 19- командные бои
• resultFieldName - имя поля, в которое надо записать результат (в виде строки)

 

UbGeneratorBinding

Скрытый текст

Оптимизированный аналог repeat для прокручиваемого лейаута. В блоке, где он используется обязательно должны быть заданы ненулевые itemWidth и itemHeight.

 

(hblock    (style       (width 100%f)       (scrollbarController "lesta.unbound.style.UbScrollingControllerTouch")       (layout "lesta.unbound.layout.measure.CarouselLayout")       (itemWidth 416)       (itemHeight 440)    )      (bind controller "lesta.unbound.controls.UbCarouselController")    (bind generator "_repeatCollection; _repeatElement; externalData")

 

От обычного repeat отличается тем, что не создаёт сразу все элементы, а создаёт и отображает только те, которые есть на экране. Первые 3 параметра - такие же как и у repeat: массив, по которому идём, имя элемента и дополнительные данные.

 

UbInOutActionBinding

Скрытый текст

Отправляет события при появлении элемента на сцене и его удалении.

 

(bind inoutAction "'showAction'; 'hideAction'; externalData")

• showAction - событие на появление элемента
• hideAction - событие на исчезание элемента
• externalData - дополнительные данные для события

 

UbIMEEnableBinding

Скрытый текст

Ищет в блоке дочернее текстовое поле и включает для него языковую панель для языков с иероглифами.

 

(bind imeEnable)

 

UbFadeBinding

Скрытый текст

Вариация UbTransitionBinding, скрывающая объект в начальном состоянии анимации.

 

<bind name="fade" value="somevalue"/>

 

UbBlurLayerBinding, UbBlurMapBinding

Скрытый текст

Отмечают блоки, к которым привязаны как слои для blurLayer, так и для blurMap соответственно.

 

<bind name="blurLayer" value="0"/> <bind name="blurMap" value="0"/>

 

UbStageSizeBinding

Скрытый текст

Кладёт в scope данные о размере сцены в поля stageWidth, stageHeight, uiScale и отправляет событие stageResize при их изменении.

 

<bind name="stageSize"/>

 

UBClickSplitBinding

Скрытый текст

При клике по объекту кроме обычного события 'click' отправляет события  'left_click', 'right_click', 'middle_click' - в зависимости от того, какой кнопкой кликнули.

 

<bind name="clickSplit"/>

 

UbLinearChartBinding

Скрытый текст

Рисует в блоке, к которому привязан, линейную диаграмму по заданным данным.

 

<bind name="linearChart" value="someValue ..."/>

 

 

[MatroseFuchs]

Список байндингов DataHub 2.0

 

DHCollectionRepeatBinding

Скрытый текст

(bind collectionRepeatDH "ComponentClassID; itemRenderer; path; extraData; useInvertedDirection")

Работает аналогично repeatBinding, но идёт не по переданному массиву, а по коллекции в DataHub. Параметры:

• ComponentClassID - ID класса компонента, они прокинуты в scope в виде констант "CC" (как сокращение от ComponentClass). Например, CC.crew, CC.channel
• itemRenderer - имя элемента, аналогично RepeatBinding
• path - необязательный параметр, указывающий путь к дочерней коллекции. Например, если вам не нужны все экипажи, а только японские, отсортированные по уровню, то path будет например, такой: 'japan.sortByLevel'. Разумеется, соответствующие коллекции должны быть созданы в DataHub
• extraData - дополнительные данные для элемента. Если null - то биндинг отрабатывать не будет.
• useInvertedDirection - указывает порядок отображения элементов (прямой/обратный). По умолчанию - прямой(false).

 

DHCollectionGeneratorBinding

Скрытый текст

Аналог оптимизации UbGeneratorBinding, но для коллекций DataHub. Параметры - те же, что и у DHCollectionRepeatBinding, но без useInvertedDirection. Те же преимущества и ограничения что и у UbGeneratorBinding.

 

(bind generatorDH "ComponentClassID; itemRenderer; path; extraData")

 

DHCollectionBinding

Скрытый текст

Достаёт из DataHub коллекцию (в виде массива сущностей) и записывает её в scope.

 

(bind generatorDH "ComponentClassID; scopeField; path")

• ComponentClassID - ID класса компонента, они прокинуты в scope в виде констант "CC" (как сокращение от ComponentClass). Например, CC.crew, CC.channel

• scopeField - поле в scope, в который запишется коллекция
• path - необязательный параметр, указывающий путь к дочерней коллекции. Например, если вам не нужны все экипажи, а только японские, отсортированные по уровню, то path будет например, такой: 'japan.sortByLevel'. Разумеется, соответствующие коллекции должны быть созданы в DataHub

 

DHEntityBinding

Скрытый текст

Достаёт из DataHub сущность по id и записывает её в scope.

 

(bind entityDH "'scopeField'; entityId")

• scopeField - поле в scope, в который запишется сущность

• entityId - id сущности в DataHub

 

DHHandleEventBinding

Скрытый текст

Слушает событие компонента и по нему отправляет событие в scope.

 

(bind handleEventDH "path; event; externalData; direction")

• path - Путь к событию, которое слушаем, в scope. Например, 'someEntity.ssomeComponent.evSomeEvent'

• event - Имя события, которое надо отправить'evSomethingHappened'
• externalData - Необязательный. Дополнительные данные к событию.
• direction - Необязательный. Направление события (аналогично UbDispatchBinding).

 

DHWatchBinding

Скрытый текст

Достаёт значение из компонента и следит за его обновлением.

 

(bind watchDH "'scopeField'; eventsArray ; entity.component.value")

• scopeField - поле в scope, в который запишется значение
• eventsArray - массив событий, по которым изменяется значение. Например, ['entity.component.evChangeEvent']
• entity.component.value - значение, которое надо взять

 

DHDataRefBinding

Скрытый текст

Следит за обновлением сущности, связанной со scope элемента и кладёт ссылку на неё в scope. Нужен для использования внутри элементов, которые используются в DHCollectionRepeatBinding и DHCollectionGeneratorBinding.

 

(bind dataRefDH "'entity'; '$dataRef.ref'")

 

[MatroseFuchs]

Список поддерживаемых событий (events) для мыши

Unbound поддерживает лишь часть мышиных событий из ActionScript 3.0.

Пример:

(bind dispatch "'click'; 'eventName'; {}")

 

событие	описание
click	Щелчок левой кнопкой мыши
mouseDown	Срабатывает в момент нажатия левой кнопки мыши
mouseUp	Срабатывает в момент отпускания левой кнопки мыши
mouseWheel	Прокрутка колёсика мыши в любом направлении
mouseOver	Наведение указателя на элемент
mouseOut	Срабатывает в момент ухода указателя мыши с элемента
mouseMove	Срабатывает в момент движения указателя над элементом
rollOver	Аналогично mouseOver, но не сработает над дочерними элементами
rollOut	Аналогично mouseOut, но не сработает над дочерними элементами

Примечание

В ActionScript есть разница между mouseOver/rollOver и mouseOut/rollOut, в Unbound она сохраняется.
Это значит, что событие mouseOver сработает как над родителем, так и над детьми, в отличие от rollOver, который сработает один раз над родителем и не сработает над детьми.

[MatroseFuchs]

Блоки

Элемент — это независимый корневой блок самого верхнего уровня, внутри которого задаются остальные дочерние блоки. Пример описания корневого блока в XML файле:

<block className="SomeClassName">

Объявление элемента нужно в двух случаях:

1. Когда мы хотим создать новое окно;
2. Когда мы хотим создать новый элемент, который будет использоваться в любом существующем окне.

При этом, элемент может создаваться как динамически (на основе выполнения логических условий), так и статически.
Пример динамического появления блока — кнопка «Забрать награду» в календаре:

 

Дочерние блоки бывают следующих типов:

• block — спрайтовый блок;

  <block> ... </block>

• tf — текстоый блок;

  <block type="text">

• mc — блок типа Movie Clip, определённый в каком-либо флэшовом *.fla-файле и экспортированный в ActionScript; 

  <block className="some_class_name" type="native">

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

[MatroseFuchs]

Стили

Облик элемента задаётся набором атомарных стилевых свойств, таких как высота, ширина, цвет, расположение и так далее.

 

Скрытый текст

Свойство	Значения	Описание	Единица измерения	Пример
Стили, определяющие поведение блока
flow	vertical horizontal htile vtile По умолчанию: vertical	Порядок расположения дочерних блоков внутри родительского. vertical — дочерние элементы располагаются вертикально, сверху вниз; horizontal — слева направо; htile — мощение слева направо, сверху вниз; vtile — мощение сверху вниз, слева направо.	—	(flow htile)
overflow	scroll hidden	Поведение блока, когда содержимое в него не помещается. scroll — появляется полоса прокрутки; hidden — то, что не влезло, обрезается границами элемента.	—	(overflow hidden)
hitTest	true / false По умолчанию: true	Разрешать ли коллизию с курсором мыши		(hitTest false)
Стили, определяющие расположение блока и его размеры
position	relative absolute	Тип позиционирования элемента. По умолчанию — относительный. Если абсолютный, то все остальные блоки не	—	(position absolute)
top	Численное значение + единица измерения		пиксели (px), проценты (%), проценты от ширины экрана (sw), проценты от высоты экрана (sh), адаптивные проценты (%f)	(top 16px)
bottom	Число + единица измерения		px, %, sw, sh, %f
left	Число + ед. изм.	X-координата положения левого края элемента относительно родителя. По умолчанию — 0.	px, %, sw, sh, %f
right	Число + ед. изм.	X-координата положения правого края элемента относительно родителя. Используется для выравнивания по правому краю родителя. По умолчанию — 0.	px, %, sw, sh, %f
width	Число + ед. изм.	Ширина элемента. По умолчанию — 0.	px, %, sw, sh, %f
height	Число + ед. изм.	Высота элемента. По умолчанию — auto, т.е. вычисляется на основе высоты содержимого.	px, %, sw, sh, %f
maxWidth	Число	Максимальная ширина По умолчанию — auto.	только число!	(maxWidth 256) Баг: если указать размерность, например, (maxWidth 256px), то работать не будет.
maxHeight	Число	Максимальная высота. По умолчанию — auto.	только число!	см. выше
Стили, определяющие отступы элемента от соседей внутри родителя
marginLeft	Число + ед. изм.	Отступ слева	px, %, sw, sh, %f	(marginLeft 16px)
marginRight	Число + ед. изм.	Отступ справа	px, %, sw, sh, %f
marginTop	Число + ед. изм.	Отступ сверху	px, %, sw, sh, %f
marginBottom	Число + ед. изм.	Отступ снизу	px, %, sw, sh, %f
margin	Строка	Составной отступ. Принимает четыре параметра через вертикальный разделитель. Два варианта использования: (margin left|right|top|bottom) или (margin leftAndRight|topAndBottom)	px, %, sw, sh, %f	(margin 16px|8px|16px|8px) (margin 32px|24px)
Стили, определяющие отступы для дочерних элементов внутри самого элемента
paddingLeft	Число + ед. изм.	Сдвиг содержимого элемента от его левой границы	px, %, sw, sh, %f	(paddingLeft 16px)
paddingRight	Число + ед. изм.	... от правой границы	px, %, sw, sh, %f
paddingTop	Число + ед. изм.	... от верхней границы	px, %, sw, sh, %f
paddingBottom	Число + ед. изм.	... от нижней границы	px, %, sw, sh, %f
padding	Строка	Составной сдвиг дочерних элементов	px, %, sw, sh, %f
Стили, определяющие заливку
alpha	Число в диапазоне [0; 1]	Уровень непрозрачности. 0 — полностью прозрачный, 1 — полностью непрозрачный. По умолчанию 1.	—	(alpha 0.9)
backgroundColor	Число в шестнадцатеричном формате с прозрачностью	Цвет фона. По умолчанию 0x0	—	(backgroundColor 0x33000000)
backgroundImage	Строка	Путь к фоновой картинке. Используется только через (bind style)	—	(bind style "'backgroundImage'; 'url:../events/british_event/icons_rules/icons_rule_operation_battle.png' )
backgroundRepeatX	true / false	Повторять ли картинку по горизонтали	—	(backgroundRepeatX true)
backgroundRepeatY	true / false	Повторять ли картинку по вертикали	—
backgroundStretchX	true / false	Разрешать ли растягивать картинку по горизонтали	—
backgroundStretchY	true / false	Разрешать ли растягивать картинку по вертикали	—
Текстовые стили
fontSize		Кегль шрифта
textColor		Цвет шрифта в шестнадцатеричном формате без альфа-канала. По умолчанию 0x000000
textAlign	left / right / center	Выравнивание текста по левому или правому краю По умолчанию — left.
marginText		Отступ текста от границы текстового блока
multiline	true / false	Разрешать ли перенос текста на следующую строку
leading		Интерлиньяж (относительное расстояние между строками текста)
Прочие стили
widthByChildren
heightByChildren
itemWidth
itemHeight
selectable
focusable
mouseEnabled
mouseChildren
backgroundSprite
backgroundSize
scrollbar
dropShadowFilter
glowFilter
blurFilter
layout
wheelScrollSpeed

 

Отдельные стилевые свойства можно объединять в стилевые классы

• class — стилевой класс;
• style — выражение, задающее стиль элемента в конкретно этом блоке (так называемый inline-стиль) через перечисление стилевых свойств.
• атомарные стилевые свойства,

По аналогии с HTML, применяется то стилевое свойство, которое применено к элементу последним:

Скрытый текст

 

<css name="$SomeClass">     <backgroundColor value="0xff000000"/>            # заливка белым цветом </css>     <block className="$SomeElement">     <styleClass value="$SomeClass"/>                 # в классе определена белая заливка...     <style>         <backgroundColor value="0xff00ff00/>         # ...но по факту, она будет синяя, потому что это свойство применено последним     </style> </block>

 

 

 

[MatroseFuchs]

Типографика

Шрифт

Основной шрифт, используемый в игре, это Warhelios Condensed. Он бывает в двух начертаниях — обычном (WarheliosCondC) и жирном (WarheliosCondCBold).

Правила использования

Следует избегать использование своих стилей текста, и вместо этого использовать готовые стилевые классы:

Класс	Для чего используется
$TextDefault13NM	второстепенный (вспомогательный) текст
$TextDefault15NM	основной класс, используйте его в большинстве случаев
$TextDefault17NM	заголовки 4 уровня
$TextDefault19NM	заголовки 3 уровня
$TextDefault21NM	заголовки 2 уровня
$TextDefault23NM	заголовки 1 уровня
$TextDefaultBoldNM	имя корабля и его уровень, шапки таблиц, заголовки разворачиваемых списков, заголовки групп характеристик
$TextDefaultBold17NM	заголовки параграфов
$TextDefaultBold19NM	заголовки 3 уровня повышенной значимости
$TextDefaultBold21NM	заголовки 2 уровня повышенной значимости
$TextDefaultBold23NM	заголовки 1 уровня повышенной значимости, заголовки окон

 

Пример стилизации текста

Исходный текст:

<block type="text"">     <bind name="text" value="'Hello, world!'"/>  # этот текст будет чёрного текста и в гарнитуре Arial </block>

 

Теперь добавим стандартный стилевой класс, использующий белый цвет по умолчанию:

<block type="text"">     <styleClass value="$TextDefaultNM/>  # теперь текст стал белым, с кеглем 15px, в гарнитуре Warhelios Condensed     <bind name="text" value="'Hello, world!'"/> </block>

 

Теперь поменяем текст, переопределив текст из класса своим, добавив атрибут (textColor) в блок (style):

<block type="text"">     <styleClass value="$TextDefaultNM/>     <style>         <textColor value="0xFFCC66"/>    # золотистый цвет премиумных кораблей     </style>     <bind name="text" value="'Hello, world!'"/> </block>

[MatroseFuchs]

Цвета

Ограниченная палитра специальных цветов используется в игре для текстов и иконографики:

В общем случае, цвета можно выбирать из палитры так называемых безопасных Web-цветов: