понедельник, 24 января 2011 г.

Создание ActionScript 3.0 компонентов во Flash. Часть 1.

Вольный перевод серии статей про создание AS3 компонент во Flash CS3.
Источник. Автор Jeff Kamerer.

Часть 1: Представление компонентов

Этот цикл статей написан для предоставления инструкции по технике создания ActionScript 3.0 компонентов в Adobe Flash CS3 Professional. После прочтения этой статьи Вы узнаете, как сделать следующее:
  •  Настроить слои и кадры в мувиклипе символа компонента
  •  Реализовать предпросмотр (Live Preview) компонента
  •  Регистрировать события
  •  Поддерживать стили и редактируемые обложки
  •  Управлять рисованием при помощи модели аннулирования (invalidation model)
  •  Управлять фокусом
  •  Настроить ввод с клавиатуры
  •  Создать скомпилированный клип ComponentShim для определений ActionScript
  •  Развернуть компонент в панели компонентов

Для этого цикла статей сосредоточимся на создании компонентов, моделируемых при помощи компонентов пользовательского интерфейса (User Interface) Flash CS3. Эти компоненты используют систему рычагов основных классов и других классов, которые назовем "инфраструктура компонента пользовательского интерфейса ".

Существует множество функциональных возможностей в инфраструктуре, которые делают процесс создания компонента быстрее и проще. Кроме того, существует множество соглашений, соблюдая которые можно создать новые компоненты, совместимые с уже готовыми компонентами пользовательского интерфейса (UI). Тем не менее, здесь Вы много узнаете об использовании и расширении API инфраструктуры. Чтобы предложить всеобъемлющий обзор, большая часть статей посвящена работе с этим API.

Создание основанного на FLA редактируемого компонента, построенного в том же стиле, что и компоненты UI, является основным направлением этой серии. Но, кратко мы рассмотрим и создание нередактируемого компонента, основанного на SWC.

Необходимые знания
Чтобы получить наибольшую пользу от этой серии статей, Вы должны быть знакомы с Flash CS3, в том числе с тем, как использовать Timeline, Property inspector, Components panel, Components inspector, Library и панель Actions. Кроме того, Вы должны быть знакомы с основами ActionScript 3.0, включая объявление и импорт пакетов и классов, объявление модификаторов доступа (public, protected, private, dynamic, static и т. д.), понимание разницы между классом и интерфейсом, строгий режим (strict mode), событийную модель (event model) и список отображения (display list).

Эта серия построена вокруг одного основного примера (компонент MenuBar), который предназначен исключительно как образец, а никак не полный компонент с надежной реализацией. Таким образом, нет никаких гарантий полного и правильного поведения. Компонент MenuBar не пытается соответствовать всем функциональным возможностям компонента Adobe Flex 2 MenuBar или любого другого MenuBar виджета или компонента. Вы сможете создать компонент MenuBar как пример проекта, основная цель которого – показать, как можно создавать свои собственные компоненты.

Что такое компонент?
Компонент представляет собой виджет пользовательского интерфейса, такой как: кнопка (button), флажок (checkbox) или меню (menu bar). Вместо того чтобы написать весь код и графику виджета, Вы можете просто перетащить компонент в Вашем FLA файле из панели Components на сцену.

Flash разработчики могут управлять компонентом при помощи ActionScript, однако во многих случаях можно настроить параметры компонента в собственном инспекторе. Компоненты не обязательно могут быть простыми элементами пользовательского интерфейса, некоторые из них могут быть достаточно сложными как, например, компонент FLVPlayback, который проигрывает видео или DataGrid, представляющий собой таблицу данных.

Среди различных версий Flex, Flash и ActionScript есть много способов создать компонент. В этой серии статей рассмотрим компоненты ActionScript 3.0 созданные во Flash CS3. В понимании Flash, компонент это мувиклип или скомпилированный клип, который Flash разработчик может перетащить из панели компонентов на сцену. Мувиклип должен быть экспортирован в ActionScript и должны быть предоставлены параметры, которые могут быть заданы на вкладке Parameters инспектора свойств или в панели Component Inspector.

Предпросмотр
Наличие предпросмотра (Live Preview) компонента означает, что компонент пропорционально изменяет размеры при изменении ширины или высоты (вместо простого масштабирования как у большинства форм (shapes) и символов (symbols)). Кроме того, предпросмотр обновляется с учетом параметров, установленных разработчиком, как например: dataProvider, label или visible.

Работа предпросмотра компонента Flash CS3 на ActionScript 3.0 на самом деле похожа на работу превью компонента на ActionScript 1.0 и 2.0. Заметим, что когда мы говорим о предпросмотре в компоненте на ActionScript 3.0, то не имеем ввиду превью компонента, поддерживающего Flex Builder 2.

Инфраструктура компонента пользовательского интерфейса (UI)
Компоненты пользовательского интерфейса, включенные в Flash CS3, построены по принципу "Инфраструктуры компонента UI". Инфраструктура состоит из классов, определенных в пакетах fl.* (не путайте с Flex 2 фреймворком, у которого это уже mx.* пакеты). Чтобы избежать путаницы с Flex 2 фреймворком не будем использовать термин фреймворк, будем говорить инфраструктура компонента UI.

Создаваемый класс компонента на основе инфраструктуры должен расширять класс fl.core.UIComponent и должен также соблюдать руководящие принципы и другие требования, рассматриваемые в этой серии. Вы должны реализовать определенные методы, чтобы подключить, например invalidation и styling модели.

Основной пример, описанный в этой серии, компонент MenuBar, построен с использованием инфраструктуры компонента UI, поскольку таким образом построено большинство компонентов. Некоторые компоненты Flash CS3 не используют инфраструктуру: FLVPlayback и FLVPlaybackCaptioning. Создание компонентов, которые не основаны на инфраструктуре, выходит за рамки этой серии.

Компоненты FLA против SWC
Компонент на основе FLA это мувиклип, доступный для редактирования во Flash. Когда Вы перетаскиваете компонент, основанный на FLA, из панели Components на сцену или в библиотеку, это то же самое, если бы Вы открыли FLA файл в качестве внешней библиотеки и взяли бы один символ из нее.

Перетаскивание компонента в файл FLA также импортирует всю библиотеку символов, используемых этим компонентом, в библиотеку FLA файла, и эти символы становятся также доступными для редактирования. Основная причина использования компонентов на основе FLA состоит в том, чтобы включить библиотеку символов, использующихся для скинования компонента и для возможности их редактирования. По этой причине компоненты UI основанные на FLA включены в Flash CS3.

Компонент SWC это скомпилированный клип. Его можно рассматривать, как предварительно опубликованный SWF, встроенный в библиотеку. Таким образом, предварительно опубликованные компоненты SWC никак не могут быть изменены Flash разработчиком.

Компоненты SWC публикуются быстрее, чем мувиклип или компонент FLA, в основном потому, что его ActionScript код уже скомпилирован. Компоненты FLVPlayback и FLVPlaybackCaptioning являются примерами SWC компонентов.

Компоненты UI на основе FLA используют эффективную технику публикации компонентов SWC. Каждый UI компонент включает скомпилированный клип ComponentShim. Этот скомпилированный клип содержит все определения ActionScript для компонентов UI, включая всю инфраструктуру компонента UI. Позже в этой серии посмотрим, как этот скомпилированный клип работает.

AS2 также поддерживает SWC файлы, но в формате отличном от SWC на AS3. AS2 SWC файлы полностью совместимы с AS3 SWC файлами и скомпилированными клипами. Любой SWC файл может быть скопирован в папку Components во Flash. Flash может определить, какие компоненты AS2 и какие AS3 и соответствующим образом их обрабатывает.

Комментариев нет:

Отправить комментарий