На сегодняшнем уроке  мы научимся создавать простой прелоадер.

Шаг 1

Открываем новый документ в программе Sothink SWF Quicker.
Задаём такие параметры:

Вы можете задать другие размеры и фон.

Шаг 2

Нажимаем Ctrl + F8 ( или Insert – New Symbol). В открывшемся окне выбираем Graphics

На панели Shape устанавливаем такие параметры:

Цвет заливки можно выбрать и другой. Он не будет иметь значения.

Нарисуйте инструментом Pen (P) или Line(N) зигзаг примерно такого вида:

Шаг 3

Еще раз нажимаем Ctrl + F8 ( или Insert – New Symbol). Создаем еще один графический символ. На этот раз на панели Shape устанавливаем такие параметры:

То есть выбираем стиль заливки  линейный. Выбираем инструмент Rectangle (R), и рисуем прямоугольник примерно такого вида:

На точность размеров не обращайте внимание. Немного дальше мы его трансформируем так как нам это будет нужно.

Шаг 4

В третий раз нажимаем Ctrl + F8 ( или Insert – New Symbol). Но на этот раз создадим не графический символ (Graphics), а мувиклип (Movie Clip). Смотри рисунок ниже:

В открывшемся окне редактирования мувиклипа добавим на временную шкалу еще один слой. Поместим в первый слой созданный нами в шаге 3 графический символ (прямоугольник), а во второй слой графический символ, созданный в шаге 2 (зигзаг). Отцентрируем его, т.е. зададим х и у равными нулю. См. рисунок:

Выделим во втором слое кадр 90 и нажмем F5. Т.е на протяжении всех 90 кадров зигзаг будет отображаться таким, как в кадре 1.

А вот расположенному в первом  кадре первого слоя прямоугольнику в разных кадрах мы будем задавать разные координаты. Сделаем ключевыми (F6) следующие кадры: 1, 9, 17, 25, 33, 34, 35 45, 46, 54, 62, 70, 77, 79 и 80.

В первом кадре расположим прямоугольник примерно так:

Ниже я привожу картинку в виде таблицы с координатами во всех вышеперечисленных пятнадцати ключевых кадрах:

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

Вот как это выглядит на панели Transform:

Между всеми ключевыми кадрами необходимо выбрать Create Motion Tween, предварительно щелкнув правой кнопкой мыши между соответствующими кадрами.

На этом подготовительная работа закончена.

Шаг 5

Переходим в основную сцену, и добавляем на временной шкале еще два слоя:

Переименуйте их так, как Вы видите на рисунке выше.

Шаг 6

Поместите в первый кадр первого слоя, созданный нами мувиклип. А в первом кадре второго слоя, используя инструмент Text (T), напишите слово «Загрузка»,  или «Loading» (кому как больше нравится). Разместите их на рабочем холсте примерно так:

Шаг 7

Выделите первый кадр третьего слоя, перейдите на панель Action, и вставьте следующий код:

Выделите второй кадр третьего (Action Layer) слоя, и вставьте такой код:

Нажмите клавиши Ctrl + Enter и протестируйте результат. Если Вы всё сделали правильно, то должно получиться примерно следующее:

Основной ролик будет начинаться с 3-го кадра. Первый  кадр назовите start, а последний end.