В этом уроке вы научитесь созданию ещё одного падающего снега. Однако этот снежок можно погонять мышкой.
Ссылкой на оригинал урока от автора "Живой снег" поделился Георгий (Jorjorych).
Все разъяснения по созданию скрипта и другая полезная информация в оригинале урока. Очень советую прочесть. Я лишь даю некоторые пояснения по созданию этой флешки в программе Adobe Flash CS6.

Это моя работа по этому уроку



Как всегда начинаем работу с создания папки проекта. Назовём папку
"funkSnow".







Создайте такую папку и откройте её.
В этой папке создайте ещё две папки
"lib" и "src"
Затем откройте папку "src" и создайте в ней папку "com".



Для этого проекта нам также нужна фоновая картинка в формате jpg (это обязательный формат изображения для этого проекта).
Размер картинки может быть, конечно, любым, но для публикации в постах на Лиру желательно не более 700 x 600 пикселей.

Я взяла вот такую картинку 700 x 393 пикс.



Эту картинку необходимо поместить в папку "lib" и там её переименовать в Photo1





На этом приготовления к работе закончили и открываем программу Adobe Flash CS6.

Создаём документ ActionScript 3.0 с параметрами как на скрине.
Обращаю ваше внимание на то, что размеры Рабочего поля должны быть такими же как размер фоновой картинки.

Созданный файл ActionScript 3.0 сохраняем в формате ".fla" в папку проекта в папке "src"

Файл - Сохранить как



и даем ему какое - нибудь имя, например "Живой снег".
То есть, в проводнике указываете путь для сохранения
папка "funkSnow" - папка "src"



Теперь у вас в папке "src" находится папка "com" и файл "Живой снег" в формате ".fla"



Далее для создания Живого снега нам необходимо создать два класса

Класс SnowFlake и Класс Main.

Для этого создаем в программе новый документ Класс ActionScript 3.0

Файл - Создать
Сначала создадим Класс Main
В открывшемся диалоговом окне указываем тип создаваемого документа - Класс ActionScript 3.0 и имя Класса - Main



После создания документа Класс ActionScript 3.0 откроется блокнот для написания кода. В этом блокноте будет размещен шаблон для создания Класса. Этот шаблон нам не нужен и мы его удалим.



В чистый блокнот вставляем скрипт для Класса Main



Обратите внимание на то, что в скрипте в строчке


указываем размеры своей картинки в пикселях
width - ширина картинки;
height - высота картинки;

code:




package com{

	import flash.display.Bitmap;

	import flash.display.Shape;

	import flash.display.Sprite;

	import flash.events.Event;

	import flash.events.MouseEvent;

	import flash.geom.Point;

	

	/**

	 * ...

	 * @author MOHCTEP

	 */

	[SWF(width=800, height=600, backgroundColor=0x445566)]

	public class Main extends Sprite {

		//Импорт фоновой картинки

		[Embed(source = "../../lib/Photo1.jpg")]

		private var bg_img:Class;

		

		public function Main():void {

			stage?init():addEventListener(Event.ADDED_TO_STAGE, init);

		}

		

		private function init(e:Event = null):void {

			removeEventListener(Event.ADDED_TO_STAGE, init);

			addChild(new bg_img() as Bitmap);//Вставим импортированную картинку, как фон.

			// entry point

			//Добавим 800 снежинок с дефолтными параметрами, прямо на сцену

			for (var i:int = 0; i < 1000; i++) {

				addChild(new SnowFlake());

			}

			//Подпишемся на событие перемещения мыши

			stage.addEventListener(MouseEvent.MOUSE_MOVE, collision);

		}

		

		/**

		 * По движению мыши, сообщим снегу о коллизии.

		 * @param	e - MouseEvent.MOUSE_MOVE

		 */

		private function collision(e:MouseEvent):void {

			dispatchEvent(new Event('collision'));

		}

	}

	

}

Сохраняем документ Класс Main в папку "com".
То есть в проводнике указываем путь к сохранению
папка "funkSnow" - папка "src" - папка "com"

Файл - Сохранить как

Файл сохраняется в формате .AS



Точно также создаём Класс SnowFlake.
Только в открывшемся диалоговом окне указываем тип создаваемого документа - Класс ActionScript 3.0 и имя Класса - SnowFlake



В чистый блокнот вставляем скрипт для Класса SnowFlake.

code:




package com {

	import flash.display.Bitmap;

	import flash.display.BitmapData;

	import flash.display.Sprite;

	import flash.events.Event;

	import flash.filters.BlurFilter;

	import flash.geom.Point;

	import flash.geom.Rectangle;

	

	/**

	 * ...

	 * @author MOHCTEP

	 * @version:

	 * @created: 07.11.2014 21:51

	 * @description:

	 * SnowFlake - Пугливая снежинка :)

	 * com.SnowFlake

	 */

	public class SnowFlake extends Sprite {

		private var areaSize:Point;//Размеры области распространения снега.

		private var speed:Point;//Скорость и направление полета снежинки.

		private var collision:Point;//Направление и величина силы возмущения.

		private var distance_of_collision_sensitivity:Number;

		//Максимальная дистанция до очага возмущения, при которой снежинка еще ему подвержена.

		private var flake:Bitmap;//Ссылка на картинку снежинки. Это может быть MovieClip,Bitmap...

		//Необходима лишь для корректного удаления, возможно зависимого от типа.

		private var flakeSize:int;//максимальный 100% размер снежинки

		

		/**

		 * Конструктор. 

		 * 2 необязательных аргумента

		 * @param	areaSize - размер области занимаемой снегом. Если аргумента нет, то область примет размер проекта.

		 * @param	flakeSize - максимальный 100% размер снежинки. По умолчанию = 20 пикселей.

		 */

		public function SnowFlake(areaSize:Point=null, flakeSize:int=20) {

			this.flakeSize = flakeSize;

			this.areaSize = areaSize;

			stage?init():addEventListener(Event.ADDED_TO_STAGE, init);

		}

		

		/**** PRIVATE SECTION ****/

		

		/**

		 * Обновление параметров снежинки, при создании ее или выходе за пределы допустимой области areaSize.

		 * fly_angle - случайный угол полета снежинки в радианах. Здесь, в пределах +-45 градусов от вертикали.

		 * Масштабируем снежинку в в пределах 30 - 100% от исходного размера.

		 * Скорость полета делаем пропорциональной масштабу для придания некой перспективы. Разложим ее на вектора и запомним их в объекте speed.

		 * Новорожденной снежинке - никаких возмущений.

		 * Ставим снежинку равномерно-случайно по горизонтали и выше области.

		 */

		private function renewFlake():void {

			var fly_angle:Number = Math.random() * Math.PI / 2 + Math.PI / 4;

			scaleX = scaleY = .3 + Math.random() * .7;

			speed = new Point(Math.cos(fly_angle) * 3 * scaleX, Math.sin(fly_angle) * 3 * scaleX);

			collision = new Point();

			x = width + (areaSize.x - width * 2) * Math.random();

			y = -height - 1;

		}

		

		/**** LISTENERS SECTION ****/

		

		/**

		 * Инициализация снежинки.

		 * Здесь установим некоторые переменные.

		 * Затем нарисуем снежинку, как размытый белый кружок. 

		 * Вместо этого, можно вставить какую-то картинку.

		 * Ставим снежинку, со случайными свойствами, в случайное место, в пределах области areaSize.

		 * Запускаем ее полет и реакцию на возмущения

		 * @param	e - Event.ADDED_TO_STAGE

		 */

		private function init(e:Event = null):void {

			removeEventListener(Event.ADDED_TO_STAGE, init);

			addEventListener(Event.REMOVED_FROM_STAGE, destroyer);

			// entry point

			//Разбираемся с областью areaSize. Если в конструктор ничего не передано, то делаем область размером со сцену.

			areaSize = areaSize?areaSize:new Point(stage.stageWidth, stage.stageHeight);

			//"Чувствительная" дистанция = 10% от наибольшего из размеров области.

			distance_of_collision_sensitivity = Math.max(areaSize.x, areaSize.y) / 10;

			/**

			 * Рисуем снежинку. У меня это - размытый белый кружок, размером flakeSize х flakeSize пикселей.

			 * Вы же можете нарисовать что-то свое или импортировать картинку или анимацию

			 */

			addChild(flake = new Bitmap(new BitmapData(flakeSize, flakeSize, true, 0)));

			flake.smoothing = true;

			//Рисуем белый квадрат посередине битмапдаты

			var square_size:int = int(flakeSize / 2.5), square_border:int = int(flakeSize-square_size) / 2;

			flake.bitmapData.fillRect(new Rectangle(square_border, square_border, square_size, square_size), 0xFFFFFFFF);

			//И превращаем его в размытый кружок

			flake.bitmapData.applyFilter(flake.bitmapData, flake.bitmapData.rect, new Point(), new BlurFilter(square_border, square_border, 3));

			//Зададим снежинке уникальные размер, направление и скорость полета.

			renewFlake();

			//И поставим ее в случайное место в пределах области

			y = height + (areaSize.y - height * 2) * Math.random();

			//Разрешим снежинке лететь

			addEventListener(Event.ENTER_FRAME, moveMe);

			//и реагировать на возмущения.

			parent.addEventListener('collision', collisionHandler);

		}

		

		/**

		 * Перемещение снежинки

		 * @param	e - Event.ENTER_FRAME

		 */

		private function moveMe(e:Event):void {

			//Меняем расположение снежинки с учетом скорости, направления полета и воздействия силы возмущения.

			x += speed.x + collision.x;

			y += speed.y + collision.y;

			//Постепенно уменьшаем воздействие возмущения на снежинку

			collision.x *= .9;

			collision.y *= .9;

			//Если снежинка недопустимо вылетела за допустимые пределы, обновим ее и запустим в полет заново.

			if (x < -width || x > areaSize.x || y > areaSize.y || y < -height * 2) {

				renewFlake();

			}

			//Если сила возмущения уменьшилась до пренебрежимой, обнулим ее, чтоб не возиться с лишней плавающей точкой

			//и разрешим снежинке опять реагировать на возмущения.

			if (Point.distance(new Point(),collision)<1) {

				collision = new Point();

				parent.addEventListener('collision', collisionHandler);

			}

		}

		

		/**

		 * Реакция на коллизию.

		 * @param	e - Event('collision')

		 */

		private function collisionHandler(e:Event):void {

			if (e.target != parent) return;//Если источник возмущения не "наш", то и не реагируем

			//Расстояние до источника возмущения (курсора, в нашем случае)

			var collision_distance:Number = Point.distance(new Point(parent.mouseX, parent.mouseY), new Point(x, y));

			//Если это расстояние превышает максимальную дистанцию чувствительности, то снова проходим мимо...

			if (collision_distance >= distance_of_collision_sensitivity) return;

			//Сила воздействия обратно пропорциональна расстоянию до центра возмущения

			var collision_force:Number = (1 - collision_distance / distance_of_collision_sensitivity) * 2;

			//Направление (угол) вектора возмущения

			var collision_angle:Number = Math.atan2((y - parent.mouseY), (x - parent.mouseX));

			collision = new Point();

			//Разложим вектор возмущения по осям, с учетом его направления и силы

			collision.x = Math.cos(collision_angle) * collision_force * distance_of_collision_sensitivity;

			collision.y = Math.sin(collision_angle) * collision_force * distance_of_collision_sensitivity;

			//Запретим на некоторое время "возмущенной" снежинке реагировать на коллизии. Пусть полетает по своей кривой дорожке...)

			parent.removeEventListener('collision', collisionHandler);

		}

		

		/**

		 * Корректное харакири, после удаления со сцены

		 * @param	e - Event.REMOVED_FROM_STAGE

		 */

		private function destroyer(e:Event):void {

			removeEventListener(Event.REMOVED_FROM_STAGE, destroyer);

			// remove all listeners, displayObjects, etc...

			removeEventListener(Event.ENTER_FRAME, moveMe);

			parent.removeEventListener('collision', collisionHandler);

			//flake у нас - Bitmap. Поступаем с ним соответствующе.

			flake.bitmapData.dispose();

			while (numChildren) removeChildAt(0);

		}

	}

	

}

Сохраняем документ Класс SnowFlake также в папку "com".
То есть в проводнике указываем путь к сохранению
папка "funkSnow" - папка "src" - папка "com"

Файл - Сохранить как

Файл сохраняется в формате .AS

Теперь у нас в папке "com" два файла формата AS - Main и SnowFlake



Пришло время вернуться к нашей флешке "Живой снег" и настроить параметры документа
Переключаемся на основную Рабочую сцену(Монтажный кадр 1) и на вкладке "Свойства" в графе Класс вписываем

com.Main



Затем там же на панели "Свойства" нажимаем кнопку "Параметры публикации"

Откроется диалоговое окно для настройки Параметров публикации. В нем необходимо с левой стороны найти колонку "Опубликовать" и в ней кроме пункта "Flash" также поставить галочку в пункте "SWC". Щелкнуть по этой вкладке и в графе "Выходной файл", нажав на значок папки, указать путь к сохранению файла "Живой снег" с расширением .swc.
Этот файл мы сохраняем туда же где у нас сохранён файл "Живой снег" в формате .fla, то есть в папку "src". После указания пути к сохранению файла SWC, нажимаем в проводнике "Сохранить" и затем нажимаем "ОК" в диалоговом окне "Параметры публикации"



После этого можно тестировать флешку.
Ctrl+Enter
Программа при первом тестировании может выдать сообщение об ошибках и необходимости обновить путь к Библиотеке Flex SDK, тогда нажмите на этом сообщении "ОК" и вторично запустите тестирование флешки.

Проверьте, что у вас в папке "src" появился файл SWC
В этой папке у вас теперь должна быть папка "com", файл "Живой снег" в формате .fla, файл "Живой снег" в формате .swc и флешка "Живой снег".



Если все получилось, то можно сохранять результат

Файл - Экспорт - Экспортировать ролик

Опубликовать флешку у себя в дневнике и погонять снежок мышкой.

Серия сообщений "Уроки Flash":

уроки в разных флешпрограммах, авторские уроки flash

Часть 1 - Делаем элементарные часики.Начинаем учиться созданию flash.
Часть 2 - Как правильно записать код флешки или видео в рамочку для кодов.
...
Часть 37 - Снегопад с блёстками. Урок для Adobe Flash.
Часть 38 - Флеш эффект движения картинок. Флеш галерея «Photo Stack Gallery».
Часть 39 - Снежок «funkSnow». Урок для Adobe Flash CS6.
Часть 40 - Дополнение к уроку Снежок «funkSnow».
Часть 41 - Программное вращение 3-d во флеш. Action Script 3.
...
Часть 48 - Анимация частей картинки с помощью маски.Урок для Adobe Flash.
Часть 49 - Использование панели «Редактор движения» в Adobe Flash CS6.
Часть 50 - Анимация формы во Flash(морфинг).

Серия сообщений "Флешки Новогодние":
Часть 1 - Флешинформер "До Нового Года осталось..."
Часть 2 - Создаем флешки в программе Aleo Flash Intro Banner Maker.Часть первая.
...
Часть 18 - Календарики в зимнем дизайне.
Часть 19 - Флеш эффект движения картинок. Флеш галерея «Photo Stack Gallery».
Часть 20 - Снежок «funkSnow». Урок для Adobe Flash CS6.
Часть 21 - Дополнение к уроку Снежок «funkSnow».
Часть 22 - Программное вращение 3-d во флеш. Action Script 3.
...
Часть 25 - Флеш поздравления с Новым Годом.
Часть 26 - Флеш открытка «2015».
Часть 27 - С Новым Годом!