Лавовая лампа

Лавовая лампа

Исходный файл: Lavalamp.fla

Этот ролик воссоздает классическую лавовую лампу. На компьютерах и в сети можно увидеть множество подобных объектов. Многие из них представляют собой простые Flash-анимации, создаваемые без написания кода.

Но в этом случае после окончания анимации узор повторяется, а интереснее сделать такую лавовую лампу, узор которой в каждый момент был бы разным.

Задача проекта

В данном разделе мы создадим лавовую лампу, функционирующую по принципу случайности. Это значит, что код случайным образом определяет, когда и где появляются новые пузырьки. В результате узор никогда не будет повторяться.

Подход

Для создания лавовой лампы, работающей по принципу случайности (рис. 6.13), необходимо использовать ActionScript. Вначале необходимо создать 20 клипов, представляющих пузырьки лавовой лампы. Затем надо задать постоянный вызов функции, перемещающей пузырьки вверх и вниз по экрану.

Рисунок 6.13. Объект «лавовая лампа» состоит из дна, крышки, внутренней части из прозрачного стекла и красных пузырьков

Подготовка ролика

Создание ролика Lava Lamp требует особой тщательности. Например, пузырьки представляют собой круги без границы и с радиальной заливкой между непрозрачным и прозрачным красным цветом. Прозрачный красный цвет получается в результате установки свойства alpha в значение 0 %. На рис. 6.14 изображен клип, а также панели Fill (Заливка) и Mixer (Миксер), при помощи которых можно задать градиент красного цвета.

Рисунок 6.14. В панели Fill можно задать градиентную заливку цветом. Панель Mixer позволяет задавать значение прозрачности

Создание кода

Lava Lamp использует 20 экземпляров клипа, созданных из одного библиотечного эталона. С помощью команды attachMovie копии клипа добавляются в ролик. Более подробно о команде attachMovie рассказано в главе 5, раздел «Эффект трехмерности».

При запуске ролика в первом и единственном кадре временной шкалы выполняется функция initLamp. При этом помимо 20 клипов пузырьков будет создан массив объектов, которые определяют скорость движения каждого пузырька.

Кроме того, верхняя и нижняя части лампы будут непрозрачными, из-за чего здесь пузырьки не будут видны. Поверх клипов пузырьков будет помещено изображение полупрозрачного стекла.

При использовании команд attachMovie или duplicateMovieClip необходимо указать уровень нового клипа. Уровень определяет порядок перекрывания клипов. Все новые клипы будут помещены перед существующими. Это значит, что пузырьки будут располагаться перед изображениями верхней, нижней и прозрачной частей лавовой лампы. С помощью команды duplicateMovieClip вы можете создать новые копии этих трех изображений, которые будут помещены поверх пузырьков.

Приведем код функции initLamp:

function initLamp () {

// Инициализируем переменные, обозначающие верхнюю и нижнюю

// координаты лавовой лампы по оси Y.

top = 0;

bottom = 300;

// Создаем экземпляры клипа, содержащего пузырек.

numBubbles = 20;

for (i=0; i<numBubbles; i++) {

attachMovie("bubble", "Bubble"+i, i);

}

// Дублируем изображения стекла, низа и верха лампы, чтобы

// они оказались над пузырьками.

duplicateMovieClip("Glass", "Glass", i++);

duplicateMovieClip("Top", "Top", i++);

duplicateMovieClip("Bottom", "Bottom", i++);

// Создаем объекты, содержащие значение скорости пузырьков.

bubbles = new Array();

for (i=0; i<numBubbles; i++) {

bubbles[i] = {speed:0};

}

}

После того как все элементы подготовлены, воспроизведение ролика осуществляется по следующему принципу: время от времени вызывается функция, которая обновляет местоположение пузырьков и создает новые. Клип, расположенный за пределами рабочего поля, вызывает функцию moveBubbles в каждом событии enterFrame. Функция moveBubbles задает перемещение пузырьков вверх или вниз и их остановку в верхней или нижней части ролика, а также в одном случае из 30 вызывает функцию newBubble для создания нового пузырька.

Данный текст является ознакомительным фрагментом.