Опубликован: 23.12.2005 | Уровень: специалист | Доступ: платный | ВУЗ: Московский физико-технический институт
Лекция 11:

Компоненты: готовые и "самодельные"

Использование custom user interface

Интерфейс среды Флэш МХ, предназначенный для работы с компонентами, достаточно удобен, если ваши компоненты не слишком сложны. Но иногда требуется сделать компонент, инструменты настройки которого были бы сильно связаны друг с другом (например, при включенном свойстве "точная настройка" появляются пять дополнительных контролов и пропадают два старых). Другой пример: вы должны указать положение точки внутри некоторой области - разумеется, удобнее всего поместить точную или уменьшенную копию этой области прямо в интерфейсе настройки и попросить пользователя указать нужную точку мышью. Именно для таких целей предназначен механизм " custom user interface ", то есть интерфейса, определяемого пользователем.

Что представляет собой custom user interface

Если немного подумать, то становится понятно, что самый простой механизм, с помощью которого можно устроить custom user interface (далее - CustomUI ) - это написать отдельный флэш-ролик, который, собственно и является этим CustomUI, и обеспечить его взаимодействие с компонентом.

Именно так и поступили в Macromedia.

Сделаем простой флэш-ролик с live preview, например, что-нибудь такое:


Обмен информацией: объект xch

Чтобы закончить ролик, описывающий CustomUI, нужно обеспечить передачу заполненных в нем пользователем параметров в компонент. Для этого во FlashMX существует специальный встроенный объект по имени xch (сокращение от exchange). Создавать этот объект не нужно, для ролика, подключенного в качестве CustomUI он будет доступен и так. Фактически, поля этого объекта и будут скопированы в поля экземпляра вашего компонента при его инициализации (имеется в виду инициализация в runtime ). Впрочем, если хотите, вы можете создать объект xch явно (это может пригодиться для целей тестирования CustomUI в режиме обычного ролика, когда никто за нас о создании xch заботиться не будет). Такой дополнительный объект xch ничуть не помешает работе CustomUI.

Итак, вот какой код нам нужно написать в нашем ролике с CustomUI:

xch.width = widthTextField.text;
xch.height = heightTextField.text;
xch.roundRadius = roundRadiusTextField.text;

Где следует разместить этот код? Тут может быть два варианта:

  • разместить в CustomUI кнопку Update и "повесить" этот код на кнопку. Это самый простой способ, тогда не нужно отслеживать изменения значений в полях ввода. Но у этого способа есть и недостаток: если пользователь не нажмет на кнопку Update, измененные значения параметров никогда не попадут в поля экземпляра компонента ;
  • любым способом (например, используя обработчик onChanged() для текстовых полей) отследить, что пользователь изменил значение одного из параметров, и немедленно выполнить соответствующую строчку кода по передаче данных в xch . Этот способ сложнее, и у него тоже есть недостаток: он может привести к слишком частому обновлению live previewlive preview - дизайн-версии вашего компонента - см. далее в этой лекции), что, в свою очередь, приведет к снижению скорости разработки, если live preview сложное и обновляется достаточно долго. (Кстати, именно по этой причине скорость обновления данных в live preview - всего раз в секунду.)

Давайте теперь подключим CustomUI к нашему компоненту.

алексеи федорович
алексеи федорович
Беларусь, рогачёв
Тамара Ионова
Тамара Ионова
Россия, Нижний Новгород, НГПУ, 2009