Эффект взрыва
06.04.2008, автор Stormit, рубрики: ActionScript, Flash игры, Игровые баннерыСегодня мало какая игра или баннер обходятся без спецэффектов. Это и понятно, нужно успеть привлечь внимание посетителей раньше, чем они уйдут с сайта.
Основой большинства спецэффектов во флэше, является функция duplicateMovieClip. До появления програмного рисования и объекта BitmapData, это был чуть ли не единственный способ программирования flash-эффектов. Эта функция просто создает дубликат уже существующего клипа. В нашем случае, мы создаем набор дубликатов и дальше управляем ими по ситуации.
Сделав более 500 игровых баннеров, я заметил, что некоторые эффекты часто переходят из одной работы в другую и практически без изменений. Самый популярный среди них - эффект взрыва / брызг / осколков.
Рзберемся, как это делается (я еще не разобрался с аудиторией сайта, поэтому буду разжевывать) + пример ниже:
- Рисуем произвольную частицу (это форма нашего осколка), оборачиваем ее в символ (назовем его part).
- Еще раз оборачиваем part в символ (назовем его partGo) и внутри него делаем анимацию, как символ part улетает вправо постепенно уменьшаясь (например за 15 кадров).
- Помещаем partGo еще в один символ (назовем его boom). Заходим обратно в символ boom и в кадре пишем такой код:
partGo._visible = false; //скрываем эталонный символ i = 30; while (i--) { d = partGo.duplicateMovieClip("p" + i, i); //делаем дубликат d._rotation = Math.random() * 360; //какой сектор покрываем d._xscale = d._yscale = Math.random()*70 + 50; //добавляем реализм }
- Сейчас эффект есть, но выполняется циклично. Hам нужно только один раз, поэтому отрабатываем удаление. Спускаемся в символ partGo, добавляем 16-й (в нашем случае) пустой кадр и пишем в нем:
_parent.removeMovieClip();//удалит клип boom если он добавлен программно stop();//просто остановит анимацию, если клип добавлен руками
- Готово! Наш символ boom можно помещать в любую анимацию и он отыграет свои 15 кадров и остановится. Если этот символ должен добавляться на сцену программно, то на линейку где лежит клип boom, нужно добавить код:
boom._visible = false; lev = 0; function placeBoom(x, y){ lev++; var d = boom.duplicateMovieClip("b" + lev, lev); d._x = x; d._y = y; } placeBoom(Math.random()*200, Math.random()*200);//ложим в случайное место
- Это основное, дальше клип boom можно наворачивать: добавить вспышку огня, лучи света, мерцание осколков, добавить растр, еще пофантазировать.
Теперь сохраняем полученный клип boom, и используем его по жизни сколько угодно раз. Стоит перерисовать форму частицы part, он легко превращается в любой boom-эффект, когда летят щепки, осколки, слюни, грязь, кровь, брызги и еще что-то разлетающееся в разные стороны.
Интересно на 22%
Урок супер! То что искал:) Респект тебе! Только расскажи, пожалуйста, чайнику, как ты эти “облака” в центральном примере нарисовал
Это легко. В фотошопе, в стандартном наборе кистей, выбери с именем Spatter. В настройках кисти лучше задать случайный угол поворота. И кликни пару раз
обрежь по габаритам и экспортни как PNG.
Спасиба за урок!
оч. интересно и полезно
и Красиво:)
Огромное спасибо, брожу по сайту и ненарадуюсь
Чёйто я не разобрался, как сделать 5/6. Подскажите плиззз
Он мне после первого кода выдает ошибку в первых трех строчках
Что значит Statement must appear within on/onClipEvent handler?
**Error** Symbol=boom, layer=Layer 1, frame=1:Line 1: Statement must appear within on/onClipEvent handler
partGo._visible = false;
**Error** Symbol=boom, layer=Layer 1, frame=1:Line 2: Statement must appear within on/onClipEvent handler
i = 30;
**Error** Symbol=boom, layer=Layer 1, frame=1:Line 3: Statement must appear within on/onClipEvent handler
while (i–) {
Total ActionScript Errors: 3 Reported Errors: 3
Подскажите что нужно сделать?
Это значит что вы пишите код непосредственно на символе (не используя обработчик событий), а в данном случае код нужно писать в кадре.
Замечательно. О таком способе использовать команду дублирование думал, но не получалось. Прояснили сознание. Непонятно лишь как сделать разноцветные мувики.
полезная вещь!!!!!!!
Почему-то не работает код, выдает след ошибку:
1119: Access of possibly undefined property partGo through a reference with static type flash.display:DisplayObject.
В чем у меня ошибка?? помогите, плиизз!
Вероятно вы используете AS3, а этот код написан на AS.
вот создал анимацию, создал клип boom, ввел код…. вообще ничего не поменялось
В 3-м шаге код нужно писать внутри символа boom в кадре.
Уроки классные но почему то у меня не работают ((( просто проигрывается анимацыя летящего осколка и останавливается
Вопрос такой, во флэше 8 есть эффект таймлайн взрыв(explode) а в adobe flash cs 4 нет. может он спрятан? или взрыв теперь только программно делать?
Наверное не зря его убрали, выглядел он не очень качественно и много весил при экспорте. А способов сделать взрыв целая куча: от покадровой анимации, через анимации в клипах типа Graphic до программного движения. Уверен, у каждого на этот счёт есть свой способ
Спасибо!!!! Сам недавно начал изучать флеш, очень классная тема :)))
Робо - у меня так же было, пока я не написал имена клипов и в «instance name»
(в настройках)
Спасибо за урок! Спасибо за разжевывание — я уверен, от этого аудитория сайта будет шире
Илья, у меня такая же проблема как и у Робо, и в «instance name» я ввел имена partgo, boom и тд, всеравно неполучается. Просто показывается анимация , как будто код невидит, а вроде все правильно сделал.
Проверяйте функцией trace() какой клип или свойство теряется (обычно выводит NaN или Undefined). Без этого сложно что-то советовать.
Огромезное спасибо Вам, очень хорошие уроки… все доходчиво и красиво.
ммм, проблема как у Робо, проигрывается анимация части partGo и останавливается а вот код символа boom почемуто не учитывается… тоесть никакой реакции на него, и где этот «instance name», у меня просто 8 flash русскийи я недавно его изучать начал, заранее спасибо
Разжуйте пожалуйста Шаг 3. Ничего не получается
Я вот второй день только занимаюсь …
Поставил CS 4? там нет выбора простого AS> Только 2 и 3. мб поэтому и не так все …
Помещаем partGo еще в один символ (назовем его boom) - это то же самое что оборачиваем xxx в символ … или как то по-другому? Или создаем Символ Boom а потом из библиотеки перетаскиваем partGo? Темный лес
оО Может и тут я не так что-то мудрю …
2Blind - Проект делайте в АС2, не забудьте продублировать имя в поле InstanceName для символа partGo.
2Stormit - спасибо, очень занимательно.
Stormit,
извините, а нельзя ли выложить fla к данному уроку? А то я что-то запутался куда какой кусок кода предлагаете положить.
Ответ для тех, у кого получается только движение одной частицы.Проверено в CS4 на As2
пункт 2:
“Еще раз оборачиваем part в символ (назовем его partGo) и внутри него делаем анимацию, как символ part улетает вправо постепенно уменьшаясь (например за 15 кадров).”
Анимация создаётся не в символе partGo, а в part (тоесть в самом последнем).
попробуйте. У меня всё заработало
[quote]Анимация создаётся не в символе partGo, а в part (тоесть в самом последнем).
попробуйте. У меня всё заработало[\quote]
ИМХО это вы что-то намутили раз анимация создаеться у вас в частице!!
эмм согласен Роман, намутил. в символе partGo нужно.
подскажите пожалуйста, как вы сделали, чтобы этот взрыв проигрывался по нажатию мышкой в любом месте флешки?
ps: просто очень надо сделать так, чтобы взрыв был при нажатии на кнопку
Очень хороше что есть статьи как для начального уровня так и более продвинутого, даже такие элементарные вещи написанные легко и грамотно очень приятно читать, большой спасибо что есть такой сайт
1120: Access of undefined property partGo.
урок интересный но мои лыжи напрочь застряли.
где можно увидеть исходник урока чтобы разобраться что я не туда пишу
Привет.. прикольный урок. Немогли бы вы сделать тоже самое на as3… а можно попросить пример FLA файла?
как мне использовать swf этот.. в моем ролике на as3?
>> Павел
//–Немогли бы вы сделать тоже самое на as3… а можно попросить пример FLA файла?
очень смешно ))
в примере все расписано, в AS3 делается точно также но со спецификой AS3
//–как мне использовать swf этот.. в моем ролике на as3?
подгружаешь и используешь, но не лучше ли написать свое ?
да я и так под себя переделаю. кто вкурил тому не проблема.
но нужно понять где лыжи не едут.
Огроменное спасибо за ваш труд! Нашел кучу всяких полезностей!
хм….а у мну почему-то не получилось…один камень только летает и всё….запиши видео или флешку как сделать…..))
Огромное спасибо за такой урок! Автору - респектище! Создателю блога - мегауважуха! Сайт безумно интересный и необычный!
Как для такого эфекта - слишком простое решение))) Я бы там голову ломал и делал бы все через ж. Просто еще опыта малова-то!
Еще раз спасибо)
Ребята, ну реально не понятно какой символ в каком(
Где писать скрипты. Выложите *.fla - у кого получилось, проявите снисходительность)
Мне бы зацепиться за базу, дальше я раскопаю)
teplo1996@rambler.ru
Все понятно и замечательно!
А что написать, чтобы взрыв происходил при определенном условии?
/*AZ
“Все понятно и замечательно!
А что написать, чтобы взрыв происходил при определенном условии?”
*/
Прописываеш условие
if(”условие”){
play;
}
чтото вроде етого
На щёт «instance name» вот вам ссылочка, прочитайте всё внемательно и у вас получится
http://flash.by/article_read.asp?id=98
Не могу понять…В 5 пункте написано “на линейку где лежит клип boom, нужно добавить код”, на какую линейку? Скажите пожалуйста.
А как сделать, чтобы эффект срабатывал по клику мышкой в любом месте сцены? Как в примере № 5?
Интересный фокус! Сейчас переведу в AS3 и беру на вооружение ) Спасибо!