Уроки Flash: Облака и трава

Источник: demiart
John Bezanis (Перевод: kedicik)

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

Код для облаков

Code

//Количество облаков
clouds=6;
//Здесь просто основные границы
//Чтобы использовать точные границы,
//создайте маску в родительском слое с желаемым вами размером
//Высота неба
skyheight=Stage.height;
//Ширина неба
skywidth=Stage.width;
//Максимальный размер облака
cloudsize=300;
//Величина размытия, применяемая к формам (контурам), чтобы сделать их похожими на облака
blursize=40;
//Облака двигаются со случайной скоростью. Это минимальная скорость
cloudminspeed=.5;
//Варьирование скорости от облака к облаку
cloudspeedvariance=1;
//Создаем облака
for(c=1;c<=clouds;c++){
//Создаем пустой муви-клип для облака
 this.createEmptyMovieClip("cloud"+c,this.getNextHighestDepth());
//Генерируем облако. Перейдем в  instance name заново созданного облака
shapecloud("cloud"+c);
//Установим кординату по х как случайное значение внутри границ
 eval("cloud"+c)._x=Math.random()*skywidth-eval("cloud"+c)._x/2;
//Установим кординату по y как случайное значение внутри границ
 eval("cloud"+c)._y=Math.random()*(skyheight)-eval("cloud"+c)._height;
}
//Выполняется для каждого кадра

onEnterFrame=function(){
//Запуск для каждого облака
 for(c=1;c<=clouds;c++){
//Двигаем облако влево в соответствии с его скоростью
   eval("cloud"+c)._x-=eval("cloud"+c).cloudspeed;
//Если облако прошло сцену влево, уснавливаем его снова справа.
//Создаем новую форму и цвет
   if(eval("cloud"+c)._x+(eval("cloud"+c)._width/2)+cloudsize<0){
//Восстанавливаем координату по х
     eval("cloud"+c)._x=skywidth;
//Перерисовываем облако, даем другой цвет
     shapecloud("cloud"+c);
   }
 }
}
//Эта функция создает форму и цвет облака
function shapecloud(cloudid){
//Очищаем текущее содержимое облака
 eval(cloudid).clear();
//Устанавливаем новый тон между 224 и 255. Этот номер используется для красного
//зеленого и синего чтобы создать серый цвет
 cloudcolor=Math.round(Math.random()*31)+224;
//используем - нет линии
 eval(cloudid).lineStyle(undefined, (cloudcolor+cloudcolor*0x100+cloudcolor*0x10000), 100, false, "none", "none", "none", 1);
//Устанавливаем цвет заливки. Цвет облака используется 3 раза - для красного, зеленого и синего
 eval(cloudid).beginFill((cloudcolor+cloudcolor*0x100+cloudcolor*0x10000));
//Устанавливаем начальные координаты для облака
 eval(cloudid).moveTo(Math.random()*cloudsize,Math.random()*cloudsize);
//Рисуем невидимую линию к другой точке  которые являются облаками
//Они не похожи еще на облака до тех пор пока не применено размытие
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
 eval(cloudid).lineTo(Math.random()*cloudsize,Math.random()*cloudsize);
//Применим размытие к форме
eval(cloudid).filters = [new flash.filters.BlurFilter(blursize,blursize,2)];
//Установим новую скорость облака
 eval(cloudid).cloudspeed=Math.random()*cloudspeedvariance+cloudminspeed; 
}

Код для травы


Code

//Высота каждой былинки в траве
grassheight=35;
//Среднее расстояние между каждой травинкой
grassspacing=5;
//Максимальное колебание каждой травинки
maxsway=20;
//Количество травинок по оси х
xplots=30;
//Количество травинок по оси y
yplots=20;
//Ветер имеет положение по х и трава притягивается к этой координате
windxpos=0;
//Скорость ветра слева и справа
windspeed=0;
//Дает траве эффект изогнутости. Трава отклоняется на 1/4 от направления сверху
grasscontrol=grassheight/4;
//Массив, содержащий информацию для каждой травинки
grasscoords=[];
//Здесь цикл по полю  - рисуется каждая травинка
for (xpos=0; xpos<xplots; xpos++) {
 for (ypos=0; ypos<yplots; ypos++) {
//координата х, координата y, колебание и цвет
   grasscoords.push([xpos*grassspacing+Math.random()*grassspacing,ypos*grassspacing+Math.random()*grassspacing,0,Math.round(Math.random()*128)*65536+Math.round(Math.random()*76+146)*256]);
 }
}
//запуск в каждом кадре
onEnterFrame=function(){
//Очищем всю траву так чтобы ее можно было перерисовать с другим колебанием
 this.clear();
//Изменяем скорость ветра
 windspeed=Math.max(-50,Math.min(50,windspeed+Math.random()*40-20));
//Двигаем позицию травинок. Они перерисовываются в соответствии с позицией ветра (windxpos)

 windxpos+=windspeed;
//Если позиция ветра сдвинулась далеко влево - скорость его меняем на обратную

 if(windxpos<-100){
   windxpos=-100;
   windspeed*=-1;
 }
//Если положение ветра сдвинулась далеко вправо - скорость его меняем на обратную
 else if(windxpos>grassspacing*xplots+100){
   windxpos=grassspacing*xplots+100;
   windspeed*=-1;
 }
//Рассмотрим перерисовку каждой травинки
 for(coord=0;coord<grasscoords.length;coord++){
//Установим стиль линии. 0 означает использование  ширины волоса и grasscoords[coord][3] это цвет
   this.lineStyle(0, grasscoords[coord][3], 100, false, "normal", "none", "none", 1);
//Настроим  качание в соответствии с текущим колебанием травы и положением ветра

   grasscoords[coord][2]=Math.max(-maxsway,Math.min(maxsway,grasscoords[coord][2]+Math.max(-maxsway,Math.min(maxsway,(windxpos-grasscoords[coord][0])/100))))+(Math.random()*3-1.5);
//Подвинемся к основанию травинки

   this.moveTo(grasscoords[coord][0],grasscoords[coord][1]);
//Нарисуем изогнутую линию - дугу  к новой верхушке травинки
   this.curveTo(grasscoords[coord][0],grasscoords[coord][1]-grasscontrol,grasscoords[coord][0]+grasscoords[coord][2],grasscoords[coord][1]-grassheight+Math.abs(grasscoords[coord][2]/2));
 }

}

 


Страница сайта http://test.interface.ru
Оригинал находится по адресу http://test.interface.ru/home.asp?artId=19114