Находка для аниматора - делаем камеру во флэше

10.04.2008, автор Stormit, рубрики: ActionScript, Анимация

Когда я набрел на мульты Адама Филипса, первое что я сделал после просмотра - начал их декомпилировать. И анимацию можно детально просмотреть, и что-нибуть интересное найти. Интересное нашлось сразу, точнее я не сразу понял как из этого fla-файла, получается такой сказочный swf. Оказалось что Адам, тот еще хитрец - использует секретное оружие, которое разработал его друг Sham Banghal - виртуальную камеру. Посмотреть как она работает и скачать ее можно здесь.

Вещь очень хорошая, а главное нужная и полезная - часто выручает. Однако есть в этой версии некоторые недоработки - она корректно работает только на главной линейке. Почти всегда это не удобно, я например, предпочитаю засовывать анимации в символы - легче потом переносить между сценами. В общем переделал ее под себя, заодно перевел ее на более модные функции. Теперь она работает на любом уровне вложенности, поддерживает все виды трансформации(и цветовую в том числе). Для экстремалов, сделал поддержку фильтров (нужно раскомментировать строку в коде).

Делаем ее так: создаем клип, внутри него делаем 2 слоя. На одном рисуем рамку по размерам флэшки (это важно, иначе могут быть пустые края по сторонам) - это объектив камеры, на другом, в кадре, пишем код:

import flash.geom.Transform;
import flash.geom.Matrix;
 
var level = 0;//на сколько клипов вверх компенсировать трансформацию
 
cameraFrame._visible = false;//делаем саму рамку невидимой
init();
 
//==================================
//don't tuch this :)
 
function init(){
    var oldMode = Stage.scaleMode;
    Stage.scaleMode = "exactFit";
    w = Stage.width;
    h = Stage.height;
    Stage.scaleMode = oldMode;
    recalcParentMatrix();
    cameraStep();
    onEnterFrame = cameraStep;
    onUnload = resetStage;
}
function recalcParentMatrix() {
    mc = _parent;
    if(level){
        var i = level - 1;
    } else {
        var i = 1000;
    }
    while (i-- && mc && mc != _root) {
        var tempTrans = new Transform(mc);
        if (!parentM) {
            parentM = tempTrans.matrix;
        } else {
            parentM.concat(tempTrans.matrix);
        }
        mc = mc._parent;
    }
    cameraTrans = new Transform(this);
    topLevelTrans = new Transform(mc);
    resetM = topLevelTrans.matrix;
    resetTopLevelColor = topLevelTrans.colorTransform;
}
function cameraStep() {
    topLevelTrans.colorTransform = cameraTrans.colorTransform;
    curM = cameraTrans.matrix;
    if (parentM) {
        curM.concat(parentM);
    }
    curM.invert();
    curM.translate(w / 2,h / 2);
    topLevelTrans.matrix = curM;
    //mc.filters = this.filters;
}
function resetStage():Void {
    topLevelTrans.matrix = resetM;
    topLevelTrans.colorTransform = resetTopLevelColor;
}

Использовать камеру очень просто, создайте анимацию, как будто она движется поверх сцены и снимает то что вам нужно. Все трансформации примененные к камере, автоматически пересчитываются на сцену. Чтобы было понятнее, вот пример (здесь анимируется ТОЛЬКО камера):

По умолчанию в коде переменная level равна 0. Это значит, это значит, что трансформация буде пересчитана до _root (не важно как глубоко лежит камера). Отличное от нуля число как раз и определяет, на сколько уровней вверх пересчитывать компенсацию. Это полезно, если какие-либо объекты должны всегда находится в кадре (ложить их нужно повыше, куда компенсация не добегает). В моем примере так висит плеер. Намудрил с текстом, но если не понятно, задавайте вопросы.

Для особо ленивых, даю ссылку на готовый fla-файл:

Download: cameraX3  cameraX3 (14.7 KB, 336 hits)

P.S. Кстати давно хочу сделать какую-то игру на ее основе. А пока я играю в Blogowar.ru, чего и вам советую.

Интересно на 18%

Хотите почитать позже? Добавьте в социальные сети или закладки

(9) Хитрых на тему «Находка для аниматора - делаем камеру во флэше»

  1. TH Art 29.07.2008 в 03:31

    а в каком флеше, записан файл cameraX3? у меня в 8-ом не открывается(((
    а вообще было бы здорово, выложить урок на Demiart.ru с использованием камеры…

  2. Stormit 29.07.2008 в 20:04

    В CS3 формате.
    Не отставайте, в CS3 много интересного, как для аниматоров, так и для программистов.
    Я отправил вам на почтовый ящик файл в 8-й версии.

  3. Павел 02.09.2008 в 14:36

    здравствуйте. очень интересна камера… но вот в чем трабл… экшн скрипт не зная наверное и не стоит лезть… НО, ЧЕРТ ПОБЕРИ!!! так хочется!!! =) все сделал точно по инструкции, только не сам написал буквочку в буквочку, а копировал ваш скрипт… но все время возникает ошибка - показывает что в 55-й строке… решил пойти другим путем, сделал все один в один как показано в исходнике, даже скрипт оттуда копировал… опять та же ошибка.. помогите разобраться плз… очень надо.. ага

  4. Павел 02.09.2008 в 14:39

    а сайт классный… я у вас тут жить останусь =)

  5. Павел 15.09.2008 в 10:53

    спасибо за ответ… очень содержетельно вразумили ламера… =(

  6. Павел 17.09.2008 в 15:41

    как она работает наконец разобрался +) методом делитанского тыка… но все же остался вопрос - как изменить размер пропорции камеры? когда файл других размеров, несеметричное вытягивание камеры приводит к искажению изображения

  7. Павел 20.09.2008 в 10:55

    с этим тоже разобрался… спасибо….

  8. ука 14.10.2008 в 15:40

    очень класная штука,ваша камера (посижываю на вашем сайте хитрости изучаю)
    как писал автор выше методом тыка разобралась,
    вроде как ей пользоватся!
    но остался вопрос!
    незнаю как сделать маску присохранении файла в swf
    остаются поля всей картинки!
    а на камеру вроде как маска не действует!
    может что то элементарное ,но что?
    в любом случае спасибо за ресурс

  9. montarri 19.10.2008 в 19:06

    Классная штука)))
    И сайт хороший)))

Оставить комментарий