Home - Blog - Wallpaper

 


jw Image rotator kenburns effect edit pan and zoom with actionscript

posted on TUTORIAL




Image Rotator kenburns effect actionscript edit pan and zoom

as a long time user for jw image rotator for many website, i discovered recently that was possible to have the famous kenburns effect on this great player.

yes, the point was when activated the effect, the image was only panning and not zooming in the latest release of Jw image rotator 3.18

so i decided to fix and make for all possible to have zoom effect, since in the support forum there were some that was searching helpless.

if you land here, you know what i'm talking about

so first download the source code here of the image rotator

then extract on your computer

then browse and go \rotator\src\com\jeroenwijering\players\

edit the file RotatorView.as with notepad or the editor you prefer then at line 295 you will see the function of what we are talking about (ken burn effect)

i modified to make the zoom and you will see my comment

just play with the values to meet your taste of speed of zoom and pan.

function to change kenburns effect on image rotator

 

    /** (Re)set the ken burns fade **/
    private function moveClip() {
        var dir = random(4);
        var clp = upClip.smc;
        if(upClip.smc == undefined) { clp = upClip.mc; }
        clp._xscale *= config['rotatetime']/20 + 1;
        clp._yscale *= config['rotatetime']/20 + 1;
        if(dir == 0) {
            clp._x = 0;
        } else if (dir == 1) {
            clp._y = 0;
        } else if (dir == 2) {
            clp._x = dims[0] - upClip._width;
        } else {
            clp._y = dims[1] - upClip._height;
        }
        clp.onEnterFrame = function() {
            if(dir == 0) {
                this._x -= 0.3;
                // i added this to make zoom
                this._xscale -= 0.1;
                this._yscale -= 0.1;
            } else if (dir == 1) {
                this._y -= 0.3;
                // i added this to make zoom
                this._xscale -= 0.1;
                this._yscale -= 0.1;
            } else if (dir == 2) {
                this._x += 0.3;
                // i added this to make zoom
                this._xscale += 0.1;
                this._yscale += 0.1;
            } else {
                this._y += 0.3;
// i added this to make zoom
                this._xscale += 0.1;
                this._yscale += 0.1;
            }
        };
    };

 

then open /rotator/src/rotator.fla

compile and your swf file of image rotator will now have the kenburns zoom effect

have fun