Animated coin (Spinning) - Beginner help..

[lister110 3 Likes (Newbie)]

Hi, I really appreciate all the handwork gone into these scripts...

 

Im pretty new to Tween animation using these classes. But Im now dabbling in a small animation with a spinning coin (see http://www.ilike2flash.com/2012/06/spinning-animation-in-flash.html)

 

This was done on a standard timeline, but Im drying to replicate this using timelinelite and I'm having a few problems (newbie coder). Im trying to scale the _x and add blur and then reveal the back from _x 0 to 1 with blur to 0. and I can't seem to get this working. Here is the code so far.. can anyone help??

 

 

import com.greensock.*;

import com.greensock.easing.*;

 

back_mc.scaleX = -0;

back_mc.alpha = 0;

 

var timeline:TimelineLite = new TimelineLite({onComplete:done});

timeline.to(front_mc, 1, {scaleX:0, alpha:0, ease:Back.easeIn})

.to(front_mc, .1, {blurFilter:{blurX:50, blurY:0}, ease:Back.easeIn})

.to(back_mc, .1, {scaleX:1, alpha:1})

.to(back_mc, .1, {blurFilter:{blurX:50, blurY:0}, ease:Back.easeIn});

 

function done(){

timeline.restart();

}

 

 

lister

[Carl 10,355 Likes (Superhero)]

maybe something like this

 

import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.plugins.*;
TweenPlugin.activate([BlurFilterPlugin]);
back_mc.scaleX = -0;

var timeline:TimelineLite = new TimelineLite({onComplete:done});
timeline.to(front_mc, 0.5, {scaleX:0, ease:Back.easeIn})
  .to(front_mc, 0.2, {blurFilter:{blurX:10, blurY:0}, ease:Back.easeIn}, 0.3)
  .to(back_mc, 0.5, {scaleX:1})
  .from(back_mc, 0.2, {blurFilter:{blurX:10, blurY:0}, ease:Back.easeIn}, "-=0.5");


function done(){
  timeline.restart();
} 

I attached an fla. In the future please supply an fla that we can test. It helps us see exactly how your file is set up and we will be able to help you in a quicker fashion. 

 

thx

 

coin_cs5.zip

[lister110 3 Likes (Newbie)]

sorry, should of uploaded the file. This is great the only problem I have is the transition from front to back, there seems to be a slight jump. I have uploaded the current fla. Thanks for your help...

 

lister

 

https://onedrive.live.com/redir?resid=7E97DA5B88D54DA7!169&authkey=!AJ5ptWllClfnZzE&ithint=file%2cfla

[Carl 10,355 Likes (Superhero)]

ah, my front and back were the same so it was little less noticable.

 

paste this code into your file:

 

import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.plugins.*;
TweenPlugin.activate([BlurFilterPlugin]);
back_mc.scaleX = -0;


var timeline:TimelineLite = new TimelineLite({onComplete:done});
timeline
//front shrinks down and gets blurry toward the end
  .to(front_mc, 0.5, {scaleX:0, ease:Back.easeIn})
  .fromTo(front_mc, 0.2, {blurFilter:{blurX:0, blurY:0}}, {blurFilter:{blurX:10, blurY:0}, ease:Back.easeIn}, "-=0.2")
//back gets big and gets unblurry at the beginning  
  .to(back_mc, 0.5, {scaleX:1})
  .fromTo(back_mc, 0.2, {blurFilter:{blurX:10, blurY:0}}, {blurFilter:{blurX:0, blurY:0}, ease:Back.easeIn}, "-=0.5")
//back shrinks down and gets blurry at end 
  .to(back_mc, 0.5, {scaleX:0, ease:Back.easeIn})
  .to(back_mc, 0.2, {blurFilter:{blurX:10, blurY:0}, ease:Back.easeIn}, "-=0.2")
//front gets big and gets unblurry at beginning  
  .to(front_mc, 0.5, {scaleX:1})
  .fromTo(front_mc, 0.2, {blurFilter:{blurX:10, blurY:0}}, {blurFilter:{blurX:0, blurY:0}, ease:Back.easeIn}, "-=0.5")
  


timeline.timeScale(0.5) // slower for testing
function done(){
  timeline.restart();
}