Главная | Форум | Реклама | Shop Flash-JePo | Картинки | Регистрация | Вход
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Салют из частиц-логотип., используем AS3 + Flint.
JeepersДата: Среда, 24.08.2011, 18:43 | Сообщение # 1




Администратор портала







Главный Админ
Сталин
Группа: Администраторы
Сообщений: 937
Награды: 0
Репутация: 13

Добрый день! Сегодня мы научимся делать салют из частиц со своим логотипом.
Мой первый урок!

Вот такой эффект мы должны получить в конце.



Наша задача
Понять принцип работы библиотеки flint.

Шаг 1

Сначала нужно скачать библиотеку Flint (официальный сайт http://flintparticles.org/ , либо тут http://dl.dropbox.com/u/24358259/Flint_3_0_1_src.rar ), распаковать и установить её (Edit>Preferences>ActionScript , выбрать внизу ActionScript 3.0 Settings , в поле Source path указать путь к библиотеке) .

Шаг 2

Сохраните любую картинку с текстом (с вашим ником) и прозрачным фоном ( делать в photoshop и сохранять обязательно в *. png), которую мы будем использовать для этого урока.
Если делать эту картинку лень то возьмите мою
Салют из частиц-логотип..

Шаг 3

Создайте новый документ Flash. Нажмите Ctrl+J(Свойства Документа) и установите ширину своего документа 710 px и высоту 400 px. Выберите черный цвет фона. Установите частоту кадров анимации равную 30 и нажмите Ok.

Шаг 4

Теперь выберите File > Import > Import to stage (Ctrl+R), чтобы импортировать фотографию, которую Вы сохранили в «Шаге 2».

Шаг 5

Затем зайдите в Window>Library(Ctrl+L) , кликните правой кнопкой по нашей картинке и выберите Properties. После этого поставьте галочки на Export for ActionScript и Export in frame 1 , а в поле Class напишите «Logo» (без кавычек). Далее удалите нашу картинку со сцены.

Шаг 6
В первом кадре Layer 1 вставьте вот этот код (он подробно закомментирован, надеюсь будет все понятно)
Code

//импортируем классы
import org.flintparticles.common.actions.*;
import org.flintparticles.common.counters.*;
import org.flintparticles.common.easing.Quadratic;
import org.flintparticles.common.events.EmitterEvent;
import org.flintparticles.common.initializers.*;
import org.flintparticles.twoD.actions.*;
import org.flintparticles.twoD.emitters.Emitter2D;
import org.flintparticles.twoD.initializers.*;
import org.flintparticles.twoD.renderers.*;
import org.flintparticles.twoD.zones.*;    
//создатель эффектов(частиц)
var emitter:Emitter2D = new Emitter2D();
//количество частиц
emitter.counter = new Blast( 4000 );
//цвет частиц
emitter.addInitializer( new ColorInit( 0xFF6666, 0xFFFFFF00 ) );
//время «жизни» частиц
emitter.addInitializer( new Lifetime( 6 ) );
//точка создания частиц , их «разброс»
emitter.addInitializer( new Position( new DiscZone( new Point( 5, 0 ), 10 ) ) );
//картинка которая будет состоять из частиц, её размер, место куда полетят частицы
emitter.addInitializer( new Velocity( new BitmapDataZone( new Logo( 500, 500), -250, -500) ) );        
//параметры полета частиц
emitter.addAction( new Age( Quadratic.easeIn ) );
emitter.addAction( new Fade( 1.0, 0 ) );
emitter.addAction( new Move() );
emitter.addAction( new LinearDrag( 0.5 ) );
emitter.addAction( new Accelerate( 0, 70 ) );
// слушатель событий
emitter.addEventListener( EmitterEvent.EMITTER_EMPTY, restart, false, 0, true );
//область отображения частиц (мы её сделаем побольше)
var renderer:PixelRenderer = new PixelRenderer( new Rectangle( 0, 0, 710, 400 ) );
//фильтр для частиц
renderer.addFilter( new BlurFilter( 2, 2, 1 ) );
renderer.addFilter( new ColorMatrixFilter( [ 1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,0.96,0 ] ) );
//самое главное – показать то что мы сделали
renderer.addEmitter( emitter );
addChild( renderer );
//точка откуда будут лететь частицы
emitter.x = 350;
emitter.y = 405;
emitter.start( );
     //повторение нашего салюта
function restart( ev:EmitterEvent ):void
{
   Emitter2D( ev.target ).start();
}


Шаг 7
Запускаем нашу флешку (Ctrl+Enter)
И радуемся результату.
Скачать


Требуются: Модераторы, Журналист новостей, Дизайнер!
Shop Flash-JePo
 
Реклама
  • Страница 1 из 1
  • 1
Поиск: