Анимированная тень(As2) Вот,что должно получиться:

Анимированная тень(As2)
Вот,что должно получиться:

Берем фон

1. Делаем размер сцены 720 х 352 и скорость 27- 30 кадров в секунду.

2. Импортируем бекграунд на пока единственный имеющийся у нас слой:
[Ctrl] + [R]
или
File > Import > Import to Stage

Теперь САМОЕ ВАЖНОЕ!:)
Не забывайте именовать слои (а также только что созданные объекты). Назовем наш слой с картинкой “background image”.

3. Добаляем новый слой, называем его “text layer” и добавляем на него произвольный статический текст с произвольным оформлением. Выравниваем текст по центру сцены. Для эффектности можете добавить к нему фильтр Glow (фильтры находятся с левой стороны окна внизу при выделенном объекте в панеле свойства):

4.Теперь между слоями “background image” и “text layer” создаем еще один слой и называем его “shadow layer”. В него просто копируем текстовое поле из слоя “text layer” (фильтр Glow с этого текста можно удалить). Это и будет тенью нашего текста.

5. Преобразуем текст в графический объект (2 раза [Ctrl] + [B]), и с помощью инструмента “Free Transform Tool” отражаем текст вниз (при этом удлините его раза в три), а затем правой клавишей мыши > выбираем Distort (Искажение), и удерживая [Shift] тянем за нижний левый (или правый) угол объекта, чтобы придать перспективу нашей тени:

6.Изменяем цвет нашей тени. На фоне песка цвет должен быть немного коричневатый.
7. Преобразуем нашу тень в мувиклип ([F8]). И, чтоб не путаться сразу называем его “shadowMC” (как в библиотеке, так и в сцене).
Не забудьте выровнять тень по центру сцены, и подровнять с текстом, чтоб они соприкасались.

8. К тени добавим фильтр Blur (для придания реалистичности) с небольшим размытием (4 будет достаточно).
9. Над слоем “shadow layer” создаем слой и называем его “shadow mask layer”. На этом слое рисуем прямоугольник, который по ширине должен быть не меньше сцены, а по высоте полностью накрывать нашу тень. Контур не нужен – только заливка. И заливку меняем на градиент от черного к черному, только прозрачность вверху ставим 60% а внизу 10% (все эти параметры можно поменять в любое время):

Это будет маска прозрачности для тени.

10. Для этого преобразовываем маску в мувиклип ([F8]) и называем его “shadowMaskMC” (как в библиотеке так и в сцене). Но как маску мы добавим этот слой к тени уже программным путем.

11. Создаем над слоем “shadow mask layer” новый слой и называем его “sun layer”. На этом слое изображаем солнце.

12. После чего преобразовываем его в мувиклип ([F8]) и называем sunMC (как в библиотеке, так и на сцене). После преобразования, центр координат нашего мувиклипа оказался в верхнем левом углу, о чем свидетельствует черный крестик в указанном углу. Чтобы избежать ошибок в вычислениях, разместите начало координат по центру солнца. Для этого заходим «внутрь» мувиклипа (двойной клик на нем), выделяем «солнце» и выравниваем его по центру относительно начала координат:

13. Положение мувиклипа sunMC по высоте устанавливайте как вам нравится, а по горизонтали - отцентрируйте его по центру сцены.

Вот и всё. Что касается объектов - мы всё сделали. Теперь добавляем выше всех новый слой, называем его “actions” и в нем будем вводить свой код.
Для искажения, точнее «скашивания» тени применим матрицу преобразований. И код будет такой:

Русские слова- это объяснения кода, записывать необходимо только команды.

CODE

// импортируем необходимые модули для работы с матрицей и трансформацией
import flash.geom.Matrix;
import flash.geom.Transform;

//объявляем объект трансформации связанный с объектом тени
var myTrans:Transform = new Transform(shadowMC);

//объявляем матрицу преобразований и заполняем ее начальными значениями
var myMatrix:Matrix = new Matrix();
myMatrix = myTrans.matrix;

// а тут как мы и обещали – накладываем слой с маской на объект с тенью
shadowMC.cacheAsBitmap = true;
shadowMaskMC.cacheAsBitmap = true;
shadowMC.setMask(shadowMaskMC);

onEnterFrame = function() {
// и тепер в каждом кадре двигаем «солнце»
sunMC._x += (_xmouse - sunMC._x) / 16;
// А вот тут хотелось бы остановиться. Это должно заинтересовать новичков.
// Ибо тут мы используем формулу «плавного» движения, которую можно описать так:
// новая_координата += (куда_надо_попасть – где_мы_сейчас) / коэффициент_скорости
// регулируя коэффициент скорости мы регулируем скорость реакции объекта на движение мыши
// эту формулу желательно запомнить, если вы всерьез собираетесь заняться флешем

// вычисляем коэффициент «с» матрицы преобразований, который отвечает именно за скос по горизонтали.
// Его значение должно быть равно тангенсу угла на который мы хотим «скосить» нашу тень.
// Знак минус говорит, что тень должна «уходить» от солнца в противоположном направлении.
// В скобках вычисляем положение солнца относительно центра сцены.
// А число в знаменателе я находил уже опытным путем.
// Мне не хватает сил описать, почему именно эта формула выглядит именно так, скажу лишь,
// что вам достаточно вспомнить - что такое тангенс угла в прямоугольном треугольнике
myMatrix.c = - (sunMC._x - 360) / 230;

// И теперь применяем нашу матрицу трансформации
myTrans.matrix = myMatrix;
}

Вот и всё. Проверяем.

Дата добавления: 2015-08-29