views:

1099

answers:

2

I have a circular graphic that has 7 images on it. It needs to spin and stop on the next/previous image. It should spin through more than the 50deg required to get to the next/prev image so I added 360.

This part works fine. But when I try to add some motion blur type effect during the spin, the spin sometimes stops without completing.

The issue seems to be around the below (but I posted the full code too)

// animate the blur
var myTween:Tween = new Tween(spinner, "blur", 
                            Regular.easeOut, 16, 0, 1.3, true);
myTween.addEventListener(TweenEvent.MOTION_CHANGE, applyBlur);

// animate the rotation
var spin:Tween = new Tween(spinner, "rotation", 
                         Regular.easeOut, 0, angle, 1.5, true);
spin.addEventListener(TweenEvent.MOTION_FINISH, hideSpinner);   

/* * * * * * * * * * * * * * * * * * * * * / // Full code for ref /* * * * * * * * * * * * * * * * * * * * * /

// import blur classes
import flash.display.Sprite;
import flash.filters.BitmapFilter;
import flash.filters.BitmapFilterQuality;
import flash.filters.BlurFilter;
import fl.transitions.TweenEvent;
import fl.transitions.*;
import fl.transitions.Tween;
import fl.transitions.easing.*;


// set up the blur filter
var blurX:Number = 4;
var blurY:Number = 16;
var blur = new BlurFilter(blurX, blurY, BitmapFilterQuality.HIGH);
var targetAngle = 0;

//var targetAngles:Array = new Array(0,60,110,160,210,270,320);

// Track the last sandwich viewed
// these are the defaults to start with
var currentSandwich:MovieClip = this.sandwich1;
var nextSandwich:MovieClip = this.sandwich1;

// Show / Hide the spiner
up.addEventListener(MouseEvent.CLICK, revealSpinner);
down.addEventListener(MouseEvent.CLICK, revealSpinner);

function revealSpinner(event:MouseEvent):void
{ 
    // deactivate the buttons
    up.removeEventListener(MouseEvent.CLICK, revealSpinner);
    down.removeEventListener(MouseEvent.CLICK, revealSpinner);

    var angle:Number = 0;
    // set the rotation amount depending on what arrow was clicked
    if ( event.currentTarget.name == "up" ){
        angle = spinner.rotation + 360 + 51.42;
    } else {
        angle = spinner.rotation + -360 + -51.42;
    }
    trace(angle);

    // animate the blur
    var myTween:Tween = new Tween(spinner, "blur", Regular.easeOut, 16, 0, 1.3, true);
    myTween.addEventListener(TweenEvent.MOTION_CHANGE, applyBlur);

    // animate the rotation
    var spin:Tween = new Tween(spinner, "rotation", Regular.easeOut, 0, angle, 1.5, true);
    spin.addEventListener(TweenEvent.MOTION_FINISH, hideSpinner);   

}

function hideSpinner(event:TweenEvent):void
{   
    // reactivate the buttons
    up.addEventListener(MouseEvent.CLICK, revealSpinner);
    down.addEventListener(MouseEvent.CLICK, revealSpinner);

    // stop the listeners
    spinner.removeEventListener(TweenEvent.MOTION_FINISH, hideSpinner);
    spinner.removeEventListener(TweenEvent.MOTION_CHANGE, applyBlur);

    spinner.filters = [];
    //spinner.rotation = targetAngle;
}

function applyBlur(event:TweenEvent):void
{
    spinner.filters = [new BlurFilter(spinner.blur, spinner.blur, 1)];
}
A: 

I didn't find the reason for the tween stopping above. But this has solved the problem by using a separate package http://code.google.com/p/tweener/

ed209
A: 

The Greensock Tweening Platform (formerly TweenLite/TweenMax) is an excellent tweening library. I've never had problems setting up complex tweens with it.

Selene