Форум Flasher.ru

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)
-   Серверные технологии и Flash (http://www.flasher.ru/forum/forumdisplay.php?f=62)
-   -   Flash 8 учимся... я про себя :) (http://www.flasher.ru/forum/showthread.php?t=73208)

Andromed 15.12.2005 16:18

Flash 8 учимся... я про себя :)
 
Расматриваю новые фишки в 8-ке :) решил поделится,
извесный в своем роде эффект, вдруг кому поможет

http://www.vipsauna.com/test/logo.html
исходник там же
http://www.vipsauna.com/test/logo.fla

TERRORist 15.12.2005 18:42

Мне нужен эффект "Рыбий глаз"
То есть увеличения угла зрения камеры на флеш.
под эффектом будет битмап.

Andromed 15.12.2005 19:18

К сожалению не помню сайт где я это нашел... у меня просто в примерах лежит

но как бы там небыло выкладываю, естественно тока для 8 :) (тема такая)

http://www.vipsauna.com/test/fishey.swf

исходник тут же

http://www.vipsauna.com/test/fishey.fla

Andromed 15.12.2005 19:29

да на всякий случай кто смотрит эти примеры и видет скажем белый фон с простым рисующимся текстом...(как человек в пред теме) установите хотябы плеер 8 :) а уж потом пинайте :)...

http://www.macromedia.com/go/getflash

TERRORist 15.12.2005 20:14

Большой Сенкс!

Andromed 15.12.2005 21:53

незачто :)

Nirth 15.12.2005 22:11

если бы еще код откоментировал, и урок написал цены бы не было, в рунете очень мало толковых уроков по 8ке

Andromed 15.12.2005 22:14

ну завтра пятница попробую ченить накалякать... в обеденный перерыв ;) не уверен что будет понятно... :)

Andromed 16.12.2005 14:22

Еще один маленький примерчик, теперь уже дождик :).. конечно на реальный дождь не претендую, расматривается работа DisplacementMapFilter

http://www.vipsauna.com/test/rain.html (27 кб из за трех картинок)
исходник
http://www.vipsauna.com/test/rain.fla (627 кб)

уроки к обоим обещаю.. :)

TERRORist 16.12.2005 16:19

оч интересно, спасибо. а причем тута випсауна?)

Andromed 16.12.2005 16:27

Типа урок... :)
 
И так урок для красивой надписи c фейерверком

скачайте сфку себе на комп а то тормозит ужасно или напишите штмл страничку которая ее вызывает :) если хотите в браузере.. просто если прям так то почемуто опеределние мыши не очень идет :) должно быть все плавно и красиво :)

Посмотреть тут http://www.vipsauna.com/test/my_logo.html
Исходник тут http://www.vipsauna.com/test/my_logo.fla
Так как мы рассматриваем возможности 8 плеера то урок мы будем делать немножко по другому, так как рисовать Guaid слои нету времени :). И так у нас задача перенести эффект на клавишу мыши.
Первым делом на нижнем слое рисуем наш бэкграунд чтобы в частности использовать на нем событие OnPress даем ему инстанс нейм background_mc на втором слое создаем ключевой кадр уже в нем мы пишем код:

Код:

// смысл данного эффекат заключается в том что мы создаем пустой мувик, и
//начинаем перекрашивать в нем пиксели в нужный нам цвет
//естественно возникает вопрос если мы только добовляем пиксели, то как происходит,
//движение, в этом нам помогает ColorTransform который в каждый момент времени делает
// пиксели более прозрачными
// Например представьте что вы в первом кажре вашего мувиклипа нарисовали точку
// На втором вы эту точку сдвинули чуть вправо а вместо этой оставили точку с половиной прозрачности
// На 3 вы делаете тоже самое уже с двумя точками, в конце концов последняя точка просто исчезнет, а у вас
// появится эффект trail - хвоста, точка движется и оставляет за собой след, так же и тут
Stage.scaleMode = 'noScale';
//создаем мувик для отображения частиц
this.createEmptyMovieClip("fire", 1);
//создаем мувик для отображения обводки
this.createEmptyMovieClip("obvodka", 2);
//Создаем канвас (контейнер в котором будем рисовать)
var fireConvas = new flash.display.BitmapData(300, 300, true, 0);
//копируем созданный канвас в мувик
fire.attachBitmap(fireConvas, 1);
//создаем матрицу из стандартного класса Matrix
var baseMatrix = new flash.geom.Matrix();
//создаем объект трансформации из стандартного класса ColorTransform
var fade = new flash.geom.ColorTransform();
//устанавливаем alphaMultiplier, данный параметр отвечает за то как быстро
//картинка будет исчезать, представьте скажем мувиклип с объектом на котором в каждом
//фрейме alpha будет увеличиваться на 1.
fade.alphaMultiplier = 0.8;
// гравитация
var grav = 0.2;
//максимальное количество частиц
var maxparticles = 200;
//количество частиц генерируемое за раз
var particleNum = 2;
//цвет обводки
var obvColor = 0xFF6633;
//толщина линии обводки
var obvHeight = 2;
//цвет частички
var particlecolor = 0xFFFF6633;
//цвет полупрозрачной частички обратите внимание что первые два символа это прозрачность,
//остальное составляюще RGB цвета как обычно
var particlecolorAlpha = 0x50FF6633;
//цвет свечения частички
var particleglowcolor = 0xEEA055;
//массив с будующими частичками
var particles = new Array();
// создаем объект свечения Glow аналогичен фотошоповскому
var glow = new flash.filters.GlowFilter(particleglowcolor, 5, 15, 15);
//применияем свечение ко всему объекту содержащему наши частички
//чтобы они светились все сразу и к обводке, тому что мы рисуем
fire.filters = [glow];
obvodka.filters = [glow];
//блендмоде, как объекты внутри контейнера перекрываются, нажмите F1 на этом слове
//появится красочный хелп илюстрирующий каждое совйство
fire.blendMode = "add";
//теперь мы создаем событие на нажатие на нашем бэкграунде
//то что мы рисовали до стирается, точка рисования устанавливается
//в позицию мыши и описываем как будет выглядить наша обводка
background_mc.onPress = function() {
        obvodka.clear();
        obvodka.moveTo(_xmouse, _ymouse);
        obvodka.lineStyle(obvHeight, obvColor, 100);
};
//создаем оснавное событие
onEnterFrame = function () {
        //если левая кнопка мыши зажата
        if (Key.isDown(1)) {
                // мы продолжаем линию
                obvodka.lineTo(_xmouse, _ymouse);
                //и создаем частички которые засовываем в начало массива с ними
                for (var i = particleNum; i>=0; i--) {
                        particles.unshift(createParticle(_xmouse, _ymouse, 0, random(3)+1));
                }
                //если вдруг оказывается что частичек у нас больше чем надо
                // просто отсекаем самые последние, по число ранвое максимальному количеству частиц
                if (particles.length>maxparticles) {
                        particles.length = maxparticles;
                }
        }
        //теперь мы  рисуем все частички
        for (i in particles) {
                currparticle = particles[i];
                //мы добавляем к нашей картинк один пиксель
                fireConvas.setPixel32(currparticle.x, currparticle.y, particlecolor);
                // а теперь раставляем пиксели вокруг созданого получив крестик
                //но так как прозрачность вновь создаваемых меньше чем у центрального
                //из далека мы получаем вполне приятный кружочек, а не корявый пиксель
                fireConvas.setPixel32(currparticle.x+1, currparticle.y, particlecolorAlpha);
                fireConvas.setPixel32(currparticle.x-1, currparticle.y, particlecolorAlpha);
                fireConvas.setPixel32(currparticle.x, currparticle.y-1, particlecolorAlpha);
                fireConvas.setPixel32(currparticle.x, currparticle.y+1, particlecolorAlpha);
                //заставляем каждую частичку сдвинуться
                moveParticle(currparticle);
        }
        // и вот самое главное
        // мы применяем трансформацию цвета, в данном случае увеличиваем альфу
        // не так буквально, но наверно вы понимаете о чем я
        // закомменте данную строчку чтоб увидет чтоб было без нее
        fireConvas.colorTransform(fireConvas.rectangle, fade);
};
//функция создания частички
function createParticle(x, y, angle, power) {
        var prt = {};
        //позиция
        prt.x = x;
        prt.y = y;
        //случайный угол падения и сила-скорость
        angle = -angle-Math.PI+Math.PI*Math.random()*2;
        power = -power/2+power+0.5*power*Math.random();
        //вертикальная и горизонтальная скорость
        prt.vx = Math.cos(angle)*power;
        prt.vy = -Math.sin(angle)*power;
        return prt;
}
//движение частички
function moveParticle(particle) {
        // ну а тут считаем новую позицию частички
        particle.x += particle.vx;
        particle.y += particle.vy;
        //если частичка улетела ниже пола то мы ее застовляем отскочить с уменьшенной
        //вертикальной скоростью и случайной горизонтальной на порядок меньше пред.
        if (particle.y>280) {
                particle.y = 280;
                particle.vy = -Math.abs(particle.vy)/2;
                (random(2) == 0) ? particle.vx *= -Math.random() : particle.vx *= Math.random();
        }
        // заставляем частичку падать под действием силы гравитации
        particle.vy += grav;
}


Andromed 16.12.2005 16:31

ну думаю надо толкать сайт к народу... :) шучу.. просто у меня там доступ есть для меня удобно

Andromed 16.12.2005 17:16

урок по дожику...:)
 
Ну теперь настало время дождика… с ним немного сложнее объяснить но попробую.. :) правда не уверен что предыдущий урок поняли многие..

http://www.vipsauna.com/test/rain.html
исходник
http://www.vipsauna.com/test/rain.fla



и так нам нужно создать эффект капель сначала все на словах

Смысл в том что мы к нашей картинке применим только 1 фильтр, тем самым вызвав ее искажение, пример похож на эффект рыбьего глаза, только этих глаз много J и они имет определенную форму и двигаются сами по себе. И так фильтр DisplacementMapFilter, сначала опишу как он работает.
Основным его входным параметром является bitMapData, именно исходя из того что нарисовано в ней, и будет происходить на нашей картинке. Еще одними из главных параметров служат
componentX, componentY – эти параметры могут принимать только 4 значения 1 2 4 8
(1- красный 2 –зеленый 3- синий 4-альфа канал)
они отвечают за то какие цвета bitMapData будут смещать по оси Х или Y наше изображение
остальные параметры говорят о силе смещения и пр. проще говоря этот фильтр искажает каждый пиксель нашей картинки исходя из определенного шаблона. Например наш шаблон имеет 3 цвета красный синий и черный, и мы применяем его в качестве фильтра DisplacementMapFilter где componentX =1 componentY=4;
Сравнивая пиксели оригинала и шаблона при нахождении красного пикселя картинка получит смещение по оси х , синего по оси y др цветов, оставит как было…( учитывая что цвет во флеше имеет градации от –255 до 255 с интенсивностью от 0 до 100 происходит смещение в любом направлении)
Ну применительно к нашим капелькам, нам нужно создать такой динамический фильтр в котором будут создаваться участки например красного и синего цветов которые будут симулировать отдельные капельки
Если посмотреть пример то там есть объект displaceMap состоящего только из серого фона, вот именно к нему динамически привинчиваются капельки из библиотеки которые имеют красно-сине-серый фон. Что заставляет картинку искажаться в определенных областях. И так примерно разобравшишьс объектом смотрим код J


Код:

Stage.scaleMode = 'noScale';
//максимальное колисество капель
var maxDrops = 30;
//счетчик капель
var dropsCounter = 0;
//смещение по х вызывает красны цвет
var colorX = 1;
//смещение по х вызывает синий цвет.. в пред буйлде ошибся стояло 4 - альфа :)
var colorY = 3;
//сила смещения по x y
var powerX = 75;
var powerY = 75;
//точка отчета 0,0 не используется
var offset = new flash.geom.Point(0, 0);
//создаем канвас (контейнер в котором происходят измения вызванные фильтром)
var bmp = new flash.display.BitmapData(image_mc._width, image_mc._height);
// создаем сам фильтр
var displaceFilter = new flash.filters.DisplacementMapFilter(bmp, offset, colorX, colorY, powerX, powerY, "ignore");
//главное событие
onEnterFrame = function () {
        //высчитываем количество капель которое должно выпасть
        //создаем их заодно пересчитав каждую штуку
        var NDrops = maxDrops-dropsCounter;
        for (var i = 0; i<NDrops; i++) {
                dropsCounter++;
                createDrop(random(image_mc._width), random(image_mc._height/3));
        }
        //говорим нашему объекту который уже работает в displaceFilter обновится из объекта куда мы добавляем капли
        bmp.draw(displaceMap);
        //применяем фильтр к картинке
        image_mc.filters = [displaceFilter];
};
//создаем каплю
function createDrop(x, y) {
        //высчитываем глубину и цепляем каплю из бибилиотеки
        var Depth = displaceMap.getNextHighestDepth();
        var Drop = displaceMap.attachMovie("D_Place", "D_Place"+Depth, Depth);
        //устанавливаем позицию, направление движения
        Drop._x = x;
        Drop._y = y;
        var angle = -Math.PI/2;
        var power = Math.random()*2;
        Drop.vx = (Math.random())*power+2;
        Drop.vy = power*5+5;
        //берем разные размеры
        Drop._xscale = 50+random(51);
        Drop._yscale = 20+random(45);
        //высчитываем угол поворота нашей капельки по ходу жвижения
        Drop._rotation = Math.atan2(Drop.vy, Drop.vx)*180/Math.PI-180;
        //создаем событие движения нашей капельки
        Drop.onEnterFrame = moveDrop;
}
function moveDrop() {
        //капелька двигается
        this._x += this.vx;
        this._y += this.vy;
        //если капелька улетела за пределы нашей картинки удаляем ее
        //заодно и посчитав
        if ((this._y>image_mc._height) || (this._x>image_mc._width)) {
                removeMovieClip(this);
                dropsCounter--;
        }
}
// переход на разные картинки
b1.onRelease = function() {
        image_mc.gotoAndStop(1);
};
b2.onRelease = function() {
        image_mc.gotoAndStop(2);
};
b3.onRelease = function() {
        image_mc.gotoAndStop(3);
};


TERRORist 16.12.2005 20:28

те капли, которые внизу, странно пихелями помигивают

Andromed 16.12.2005 22:07

почисти кеш посмотри.. :) вроде исправил

Beastriker 16.12.2005 23:19

у меня лагает. опера 8. третий пень 600. но там и графы не особо...
это наверно fps, а не лаги??

Andromed 17.12.2005 00:35

если ты про феерверк с управлением мышью попробуй запустить локально или вызвать через html, не буду врать не знаю.. если вызвать флешку просто в браузаре, Stage становится равный размеру окна возможны лаги с обработчикм мыши у меня на работе ужасно тормозило хотя дома все ок :) и там и там maxthon (надстройка для ИЕ рекомендую.. :), не чуть не хуже оперы и файрфокса и совместимость почти всегда 100%), в опере и файрфоксе флеш обрабатывается не так как в ИЕ, в ие это просто слой а в них флеш рендерится поверх всего остального.. что не есть хорошо :) скажем попробуй разместить динамический див над флешкой... :) и т.д и т.п

c++ 18.12.2005 14:08

=Andromed=
Спасибо, конешна, за урок... но...

Это не дождь, это какие-то космические какашки! или сосульки! (в виде какашек)

Andromed 18.12.2005 15:00

Цитата:

Сообщение от c++
=Andromed=
Спасибо, конешна, за урок... но...

Это не дождь, это какие-то космические какашки! или сосульки! (в виде какашек)

Быложе для таких как ты написанно что на дождь не претендую... расматривается работа новых функций во флеше ... :) Так и знал что лучше вообще ничего не писать чтобы с такими как ты не сталкиваться..

Nirth 18.12.2005 15:17

Забей на критиков =) если жалуються значит интересуються =) Как говориться, есть люди которые делают а есть которые жалуються.

[модераториал]
запихнул код в тэги [ code ], для более удобной читабильности.

Andromed 18.12.2005 15:28

кстати немножко не в тему я тут поковырялся нашел исходники RFE быстро подправил чтобы работало с OpenGL 1.5 2.0, также чтобы коректно экспортируемый скрипт работал в 8-ке (там зарезервруемое слово появилось transform)... вопрос такой нет желания держать постоянную ссылку ? на вашем сайте (когда я его писал флешер ру был в ауте, пришлось выкладывать на флештиачер).. банер и ссылку в прогармме пихну (главное наличие картинки 190*75) Если есть желание можно связаться по почте :)

Andromed 19.12.2005 17:22

еще один пример пиксельный огонь отличие от лого в том что цвет пикселей берется из програмно созданного градиента
средствами getPixel32

пример тут
http://www.vipsauna.com/test/pixel_fire.html
исходник тут
http://www.vipsauna.com/test/pixel_fire.fla

Код:


Stage.scaleMode = 'noScale';
this.createEmptyMovieClip("gradient", 2);
import flash.geom.*;
var fillType:String = "linear";
var colors:Array = [0xFF2222, 0xDFAA31, 0xB9594F, 0xAEAEAE, 0x000000];
var alphas:Array = [100, 80, 70, 50, 90];
var ratios:Array = [0, 30, 50, 70, 0xFF];
var matrix:Matrix = new Matrix();
matrix.createGradientBox(300, 1, 0, 0, 0);
var spreadMethod:String = "pad";
gradient.beginGradientFill(fillType, colors, alphas, ratios, matrix, spreadMethod);
gradient.moveTo(0, 0);
gradient.lineTo(300, 0);
gradient.lineTo(300, 5);
gradient.lineTo(0, 5);
gradient.lineTo(0, 0);
gradient.endFill();
var gradientCanvas = new flash.display.BitmapData(300, 5, false, 0xFFCC0000);
gradientCanvas.draw(gradient);
/////////////////////////////////////////////////////////////////
this.createEmptyMovieClip("fire", 1);
var fireConvas = new flash.display.BitmapData(300, 300, true, 0);
fire.attachBitmap(fireConvas, 1);
var fade = new flash.geom.ColorTransform();
fade.alphaMultiplier = 0.8;
var fireDiametr = 40;
var fireFading = 10;
var grav = -0.2;
var maxparticles = 220;
var particleNum = 4;
var particleglowcolor = 0xFFCC00;
var particles = new Array();
var glow = new flash.filters.GlowFilter(particleglowcolor, 5, 15, 15);
var floor = 280;
fire.filters = [glow];
fire.blendMode = "add";
onEnterFrame = function () {
        for (var i = particleNum; i>=0; i--) {
                particles.unshift(createParticle(Stage.width/2+40*(Math.random()-0.5), floor, 0, random(1)+1));
        }
        if (particles.length>maxparticles) {
                particles.length = maxparticles;
        }
        for (i in particles) {
                currparticle = particles[i];
                var particlecolor = 0xFFFF6633;
                var particlecolorAlpha = 0x50FF6633;
                var pixelW = (floor-currparticle.y)/0.7;
                if (pixelW>300) {
                        pixelW = 300;
                }
                particlecolor = gradientCanvas.getPixel32(pixelW, 0);
                fireConvas.setPixel32(currparticle.x, currparticle.y, particlecolor);
                fireConvas.setPixel32(currparticle.x+1, currparticle.y, particlecolor);
                fireConvas.setPixel32(currparticle.x-1, currparticle.y, particlecolor);
                fireConvas.setPixel32(currparticle.x, currparticle.y-1, particlecolor);
                fireConvas.setPixel32(currparticle.x, currparticle.y+1, particlecolor);
                moveParticle(currparticle);
        }
        fireConvas.colorTransform(fireConvas.rectangle, fade);
};
function createParticle(x, y, angle, power) {
        var prt = {};
        prt.x = x;
        prt.y = y;
        angle = -angle-Math.PI+Math.PI*Math.random()*2;
        power = -power/2+power+0.5*power*Math.random();
        prt.vx = Math.cos(angle)*power;
        prt.vy = -Math.sin(angle)*power;
        return prt;
}
function moveParticle(particle) {
        particle.x += particle.vx;
        particle.y += particle.vy;
        var fl = fireDiametr-(floor-particle.y)/fireFading;
        var right = Stage.width/2+fl;
        var left = Stage.width/2-fl;
        if (particle.x>right) {
                particle.x = right;
                particle.vx *= -Math.random()*5;
        }
        if (particle.x<left) {
                particle.x = left;
                particle.vx *= -Math.random()*5;
        }
        particle.vy += grav;
}

)

Ion 19.12.2005 17:56

Крутизна подобных эффектов в том, что они не теряют красоты при низком качве, что позволяет повысить производительность

Andromed 19.12.2005 18:38

это да.. :) ради этого все и затевалось все переходим в low режим :), вообщето дело не в самих эффектах.. на сколько они красивы или нет, это второстепенно, просто расматриваются разные фишки типа копирования мувиклипа в bmpData и использование его содержмиого .. и т.д. и т.п., эффект это просто для наглядности.. было бы глупо взять мувик скопировать его в картинку и помеянть пиксели местами типа красный на черный и прочее.. хотя можно впринципе описать разные фильтры как в фотошопе.. анпрмире сепия сделать вроде просто будет :) сохранить цвет в матрицу colorTransform
изменить все значения Offset на темножелтый а все Multiplier оставить без изменения .. это так мысли вслух :)

c++ 19.12.2005 19:42

Сделал светящимися фейерверками надпись небольшую - прикольно :)
Захотел её в существующую flash сцену loadMovie...

Загружается, но бежит точка, но ни надписи ни эффектов... :(
Если в первом кадре сцены пишем "_lockroot = true;", то рисуется ок, но эффект брызг находится в самом низу сцену, а не около рисующей точки... :(

Что надо исправить?

MOHCTEP 20.12.2005 05:46

Мопть! :eek:
Я в осадке, как тот дождик! :D
Andromed - сплошные регардсы тебе! И спасибо!

Andromed 20.12.2005 11:08

да не зачто :)...

motor4ik 20.12.2005 11:36

лнтающие какашки супер, главное алгоритм, а кому какие какашки летающие нравятся, сам доделает :=) Андромед респект :=)

c++ 20.12.2005 12:48

=Andromed=

Сделал светящимися фейерверками надпись небольшую - прикольно
Захотел её в существующую flash сцену loadMovie...

Загружается, бежит точка, но ни надписи ни эффектов... :(
Если в первом кадре сцены пишем "_lockroot = true;", то рисуется ок, но эффект брызг находится в самом низу сцену, а не около рисующей точки... :(

Что надо исправить, подскажите, пожалста?

motor4ik 20.12.2005 15:29

уууу...с с+++ все стало на свои места, все ясно :=)

c++ 20.12.2005 15:37

=motor4ik=
а это у тебя в смайлике сопельки?

ps для ...... - я на flash вторую неделю только

motor4ik 20.12.2005 15:44

я вас не оскорблял между прочим...просто это было выяснением того почему вы тут все так раскритиковали...в 3д в том числе, на самом деле являясь всего-лишь новичком...во флэше

прошу удалить лично , оскорбительную для меня реплику.

c++ 20.12.2005 15:48

мне уже откровенно надоели бесконечные выепоны "профи-флешеров", будто функция viepon.loop основа флэша!

перестаньте выпендриваться!

хотите ответить на вопрос - ответте! и люди будут вам благодарны! не хотите - не отвечайте! но наезжать и хамить перестаньте!

Ion 20.12.2005 16:48

Забэй

c++ 20.12.2005 17:23

=Andromed=

Сделал светящимися фейерверками надпись небольшую - прикольно
Захотел её в существующую flash сцену loadMovie...

Загружается, бежит точка, но ни надписи ни эффектов...
Если в первом кадре сцены пишем "_lockroot = true;", то рисуется ок, но эффект брызг находится в самом низу сцену, а не около рисующей точки...

Что надо исправить, подскажите, пожалста?

Andromed 20.12.2005 17:31

water
 
И так что успел то сделал.. правда фантазия уже кончается.. может в конце выложу 9Scale чтонибудь.. хотя этого добра навалом :)

И так вода... только не надо орать что ты воду видел да это даже на воду не похоже.. хотя получилось не совсем плохо.. процессороного времени жрет всего 16%, но почемуто иногда maxton вылетает со свистом.. в локале и вплеере работает все на ура... причина не извесна :) ну да ладно дело не в воде а в эффекте..

тут уже исправлено в начале было не так, почемуто при тарнслейте
флеш вылетает, точнее не при нем самом а когда делаешь bitMapFil с матрицей у кторой смещение в двух направлениях через translate.. флеш вылетает ... может это исправят когданить.. пришлось оставить движение воды тока прямо, хотя прокуртить саму картинку вместе с эффектом тоже не так трудно сделать

пример тут :
http://www.vipsauna.com/test/water.html
исходник:
http://www.vipsauna.com/test/water.fla

Эффект основан на том что используются две основных функций из разных подкласов
это
perlinNoise из BitMapData.. только для BitMapData
и
DisplacementMapFilter из класса фильтров, которые как извесно только для MC
задача такая чтобы красивый эффект perlinNoise перенести в mc
задачу эту решили правда пришлось делать много сторонних буферов,
т.е. сначала создать битмапдату к нему применить Ноис, затем все это скопировать в другую дату и уже завязать как фильтр дисплейс... думаю на коде будет нагляднее а значит и понятнее

Код:

//описание слайдеров
_quality = "low";
sl1.minV = 10;
sl1.maxV = 200;
sl2.minV = 1;
sl2.maxV = 10;
sl4.minV = 0;
sl4.maxV = 10;
Stage.scaleMode = 'noScale';
//создаем мувик в котором будет формироваться карта искажения
this.createEmptyMovieClip("displace", 1);
//меняем картинку и карту местами
displace.swapDepths(water);
//создаем мувик карты искажения
displace.createEmptyMovieClip("displaceMap", 1);
//закрашиваем мувик любым цветом тем самым формируя его границы
displace.displaceMap.beginFill(0x000000);
displace.displaceMap.moveTo(0, 0);
displace.displaceMap.lineTo(water._width, 10);
displace.displaceMap.lineTo(water._width, water._height);
displace.displaceMap.lineTo(0, water._height);
displace.displaceMap.lineTo(0, 0);
displace.displaceMap.endFill();
//создаем мувик где будет формироваться Noise
displace.createEmptyMovieClip("Noise", 2);
//пересваиваем переменно значение мувиклипа, для удобства
var displaceMap:MovieClip = displace.displaceMap;
//скорость течения
var speed = 2;
//угол наклона
var alpha = 1;
//канал по которму искажаем (синий)
var channel = 4;
//закручивание волн
var rotation = 0;
//создаем канвас искажения
var displaceBitmap:flash.display.BitmapData = new flash.display.BitmapData(displace._width, displace._height);
//создаем фильтр искажения
var displaceFilter:flash.filters.DisplacementMapFilter = new flash.filters.DisplacementMapFilter(displaceBitmap, new flash.geom.Point(0, 0), channel, channel, 100, 100, "clamp");
//создаем канвас шума, на маленьком участке формируется кусок волны, потмо он копируется на всю картинку
var noiseBitmap:flash.display.BitmapData = new flash.display.BitmapData(150, 150);
//функция которая динамически изменяет параметры фолны путем пересвоения вновь созданной картинки
rebuldNoise = function (powerX, powerY, channel) {
        //описываем временный конвас
        var tmpNoise:flash.display.BitmapData = new flash.display.BitmapData(150, 150);
        // к нему применяем Noise
        tmpNoise.perlinNoise(powerX, powerY, 2, Math.floor(Math.random()*100), true, true, channel, null);
        //пересваиваем нашему конвасу
        noiseBitmap = tmpNoise.clone();
};
//инициализируем начальное искажение
var SpidVx = 0;
var SpidVy = 0;
//матрица движения волн
var waveMatrix:flash.geom.Matrix = new flash.geom.Matrix();
rebuldNoise(54, 54, channel);
onEnterFrame = function () {
        // говорим матрице сдвинуться в нужном направлении с нужной скоротсью
        waveMatrix.translate(speed, 0);
        //не работает почемуто движение в разные стороны только по одной из координат
        //иначе флешка вылетает
        //waveMatrix.translate(speed*Math.sin(alpha)*100,speed*Math.cos(alpha)*100);
        Math.round(speed*Math.sin(alpha)*100)/100;
        waveMatrix.rotate(rotation*Math.PI/180);
        //эффект закручиваня
        // а вот тут мы уже берем маленькую картинку полученную нами
        // и размножаем ее, причем для движения нам не нужно каждый раз ее рендерить
        //для отображения движения служит матрица, представьте большой мувиклип в движении
        //пож которым расположенна квадратная маска
        //короче похоже по смыслу на ээфект ландшафта когда повторящийся 
        //мувикли вовзращается, а нам кажется что задний фон бесконечно большой
        with (displace.Noise) {
                clear();
                //посомотрите хелп если repeat параметр выставит в false
                //то наша картинка 150*150 очень быстро уедет за пределы
                beginBitmapFill(noiseBitmap, waveMatrix, true, false);
                moveTo(0, 0);
                lineTo(displace._width, 0);
                lineTo(displace._width, displace._height);
                lineTo(0, displace._height);
                lineTo(0, 0);
                endFill();
        }
        //отображаем полученную карту в мувик
        displaceBitmap.draw(displace);
        //и гворим фильтру обновится
        water.filters = [displaceFilter];
};
// описание различных пользовательских настроек, работа
//слайдеров и пр...
onMouseDown = function () {
        displace._visible = true;
        water._visible = false;
};
onMouseUp = function () {
        displace._visible = false;
        water._visible = true;
};
var Watcher:Function = function (prop, oldVal, newVal, param) {
        if (newVal != oldVal) {
                switch (param) {
                case 1 :
                        rebuldNoise(Number(newVal), Number(newVal), channel);
                        break;
                case 2 :
                        speed = Number(newVal);
                        break;
                case 4 :
                        rotation = Number(newVal)/10;
                        break;
                }
        }
        return newVal;
};
sl1.watch("sredV", Watcher, 1);
sl2.watch("sredV", Watcher, 2);
sl4.watch("sredV", Watcher, 4);


Andromed 20.12.2005 17:37

проверил в IE .. эксплорер ругается накакуюто надстройку.. у меня их много целый список.. почему пока не знаю :)
Нашел ошибку почемуто при смещении матрицы сразу по двум координатам методом translate флешка виснет... самое неожиданное место :).. ищу как побороть...
Исправил...
при BitMapFill c матрицей у которой translate не по 1 координате а сразу по двум типа matrix.translate(x,y) а не скажем
matrix.translate(0,y) или matrix.translate(x,0)
флешка вылетает через какоето вромя... может кто объяснит почему вроде ничего криминального не делаю :)...

c++ 20.12.2005 19:33

Ответте кто-нить на мой вопрос пожалста!!!!

Andromed 20.12.2005 19:35

попробуй задать вопрос в др топике.. не флуди тут, лично я тебе овтечать не буду.. мне хватило 1 раза общения с тобой, тебе дали исходник если ты чтото не понимаешь почитай справку, как ты видишь здесь не расматривается loadMovie поищи поиском как что и почему... удачи

c++ 20.12.2005 19:59

Ну ты ещё сажи, что я виноват, что ТЫ на Director ни одного приличного примера показать не смог... кто виноват, что на расхваленной тобою технологии делают только всякое гумно??? Чё на меня обижаться-то???

А вопрос очень по теме - ведь вопрос по поведению после подгрузки в твоего эффекта!


Часовой пояс GMT +4, время: 05:41.

Copyright © 1999-2008 Flasher.ru. All rights reserved.
Работает на vBulletin®. Copyright ©2000 - 2026, Jelsoft Enterprises Ltd. Перевод: zCarot
Администрация сайта не несёт ответственности за любую предоставленную посетителями информацию. Подробнее см. Правила.