Случайное рисование линий в actionscript 3.0




Главная > Уроки > Action script 3.0 > Случайное рисование линий в actionscript 3.0

Случайное рисование линий в actionscript 3.0

Автор/переводчик статьи: Команда сайта flashmaster.org.ua

Дата: 2012-12-10

Случайное рисование линий в actionscript 3.0

Введение

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

Рисование не использует не единой анимации. Все происходит с помощью кода и API. Так же если кто не знал то познакомиться с функцией Random. Как видите линии появляются случайным образом, то есть после обновления страницы мы увидим совершенно другой результат. 

Что бы вам это продемонстрировать я сделал пару скринов: 

скрин 1

скрин 2

скрин 3

Урок не сложный, так как нам не потребуется работа с анимацией и понадобиться всего лишь небольшой код.

Перейдем к написанию кода:

Для начала давайте пропишем массив, с помощью которого мы будем аниммировать линии.

//Создаем массив который будет хранить информацию о каждой линии
var linesArray:Array = new Array();

//Тут мы создаем 7 линий. Если вам так не подходит можете заменить на любое другое количество.
for (var i=0; i < 7; i++) {
/* Заполнять наш массив мы будем примерно таким вот образом
linesArray[0]: это координата  x  линии 1
linesArray[1]: это координата  y  линии 1
linesArray[2]: это координата  x  линии 2
linesArray[3]: это координата  y  линии 2
ну и так дальше...
*/
// Здесь мы размещаем каждую линию, так что бы она стартовала с рандомной позиции
linesArray.push (Math.random()*stage.stageWidth);
linesArray.push (Math.random()*stage.stageHeight);
}

Все мы создали массив, теперь давайте перейдем к самой анимации.

//Устанавливаем ширину 2 пикселя и белый цвет
graphics.lineStyle (2, 0xffffff);

addEventListener (Event.ENTER_FRAME, enterFrameHandler);

function enterFrameHandler (event:Event):void {

//Создаем цикл который продолжает рисовать линии в случайное направление
for (var i:uint = 0; i < linesArray.length; i+=2) {

 //Установка стартовой точки
 graphics.moveTo (linesArray[i], linesArray[i+1]);
 
 //вычисляем новую рандомную точку, куда дальше будет проводиться линия
 var newX = (Math.random() * 16 - 8) + linesArray[i];
 var newY = (Math.random() * 16 - 8) + linesArray[i+1];
 
 //Теперь проводим линию на новые координаты
 graphics.lineTo (newX, newY);
 
 //Меняем новые координаты на текущие (это нужно для того что бы в 
 //следующем кадре линия рисовалась не с начальной координаты а с новой)
 linesArray[i] = newX;
 linesArray[i+1] = newY;

}
}

Вот и все, готово! Нажимаем Ctrl + Enter и смотрим. 

Скачать анимацию.

Просмотров: 1917


Понравился материал? Поделись с друзьями!





Подписаться на рассылку.

При перепечатки материалов ссылка на наш сайт обязательна!


 1