Поиск привел к статейке: Making a Cooler Preloader in Flex: Part 1 of 3.
Доступно, с примерами раскрывается процесс создания собственного прелоадера для Flex-приложения. Пожалуй, выделю основные положения, опустив приступы остроумия автора :).
Введение.
Для создания собственного прелоадера для Flex, необходимо всего два шага:
- Расширить класс DownloadProgressBar.
- Указать Application, в свойстве preloader, этот новый класс.
Или подробнее:
- Создать MovieClip, содержащий 100 фреймов.
- Указать ему Linkage ID без имени класса.
- Скомпилиоровать SWF.
- Написать собственный прелоадер, использующий созданный Flash MovieClip.
- Указать в mxml-коде, в теге mx:Appliction свойство preloader с именем созданного класса.
Создание Flash клипа
Автор предлагает создать 100-фреймовый клип с анимацией отображения прогресса загрузки, и добавляет в него dynamic TextField. Полученный клип он убирает в другой клип-контейнер, содержащий таймлайн с плавной анимацией появления и скрытия прелоадера. При этом необходимо дать имена всем клипам, участвующим в доступе к 100 фреймам и текстовому полю, для того, чтобы затем обратиться к ним по принципу “dot dot down” (это оказывается у нашего брата флэшера существует такой сленг, означающий "спуск" по дереву клипов к объекту, с которым нужно взаимодействовать).
Важно: Никаких скриптов в таймлане не пишем.
Затем - что еще любопытнее - автор экспортирует всё это хозяйство во Flash 8, AS2 или AS1. Как он это объясняет, если делать прелоадер под AS3, то потребуется писать класс для прелоадера, а это повлечет за собой массу работы и дополнительного объема к файлу. Наш прелоадер должен быть простым и максимально легким.
Итак, экспортируем в Flash 8, а в Linkage указываем идентификатор и ставим 1-ю и 3-ю галки. Flex должен увидеть наш Linkage ID, когда мы внедрим наш SWF.
Класс прелоадера
Создаем класс, экстендим его от mx.preloaders.DownloadProgressBar. Внедряем в него Flash контент мета-тегом [Embed(source="... /preloader.swf", symbol="Preloader")]. В конструкторе создаем и добавляем в дисплей-лист объект прелоадера. Затем, перекрывая свойство-установщик preloader, назначаем обработчики событий загрузки.
Важный момент: для того, чтобы организовать плавное скрытие прелоадера, нобходимо прибегнуть к следующему трюку. Мы предусмотрели в клипе-контейнере анимацию скрытия прелоадера (которая заканчивается, к примеру, на 20-м фрейме, а фрейм 21 пуст) . По событию onFlexInitComplete, мы добавляем скрипт в фрейм 21: clip.addFrameScript(21, onDoneAnimating);. Наш скрипт останавливает анимацию прелоадера и генерирует событие Event.COMPLETE.
Важное добавление в комментариях: В коде обработчика onDoneAnimating необходимо отписаться от всех событий, на которые подписался класс прелоадера.
Пример и исходники прилагаются: Example Source ZIP.
Попробуем, как это работает на практике.
* * *
Попробовал. Работает. Но пришлось убить часа два на следующую проблему: В примере в главном клипе скрипт устанавливается во фрейм 21. Я создал клип с таймлайном в 21 фрейм. Не заработало. Скачал пример: Download Preloader FLA. Заработало. Подменил своим - не заработало (клип крутится по кругу, но не стартует скрипт).
В итоге, выяснилось, что необходимо добавить еще один фрейм. То есть временная шкала должна содержать не менее 22 фреймов. Причина - фреймы в параметрах метода нумеруются с нуля (источник).
* * *
Выяснилось, что не обязательно использовать версию Flash8 AS2. Можно указать и Flash 9 с AS3. Однако как ни крути, скрипты из тайм-лайна вызываться не будут. В целях снижения объема SWF-файла лучше всеже использовать более старые версии - лучший результат показал Flash 6/7 AS1/AS2, но не намного.
* * *
Еще одна важная фича - фон приложения на этапе предзагрузки. Живой Flex подсказывает нам, что это можно сделать двумя путями:
- Добавить в пункте "Additional compiler arguments:" строку:
-default-background-color #336699 - Указать цвет фона в параметрах тегов Object и Embed при внедрении флэш-приложения в HTML-страницу:
Комментариев нет:
Отправить комментарий