Motion tween via code not timeline

Explorer ,
Mar 26, 2021 Mar 26, 2021

Copy link to clipboard

Copied

Using createjs

Hi, I know how to create a motion tween via the timeline but I would like to do it via code. It would be a whole lot neater as I have to tween various objects and I hate long timelines. 

I was thinking of creating an empty movieclip - well transparent just as a way of helping with position. Then I would tween the mc to the transparent mc. I seem to remember it was possible via a tween engine but I'm not sure. Googled but came up short.

Views

106

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Mar 26, 2021 Mar 26, 2021

Copy link to clipboard

Copied

Excuse me, I have just found tutorial on the Tween Class.

https://code.tutsplus.com/tutorials/an-introduction-to-tweening-with-actionscript-30--active-2022

 

By the way, this forum won't let me edit or erase my post - when I press ...more - it's empty.

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Mar 26, 2021 Mar 26, 2021

Copy link to clipboard

Copied

Oh dear - it's for AS3 not createjs.

 

//import necesarry classes
import fl.transitions.Tween;
import fl.transitions.easing.*;
 
//create our timer
var timer:Timer = new Timer(3000);
 
//start the timer
timer.start();
 
//create our tween
var tween:Tween = new Tween(square, "x", Strong.easeInOut, square.x, 300, 2, true);
 
//prevent tween from immediately tweening
tween.stop();
 
//add an event listener to timer
timer.addEventListener(TimerEvent.TIMER, startTween);
 
//create the function startTween
function startTween(event:TimerEvent):void {
    //make tween start
    tween.start();
}

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Mar 27, 2021 Mar 27, 2021

Copy link to clipboard

Copied

Literally the first Google search result for "createjs tween":

https://createjs.com/docs/tweenjs/classes/Tween.html

 

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Mar 28, 2021 Mar 28, 2021

Copy link to clipboard

Copied

Yep, I didn't search for createjs tween but rather adobe animate tween.

Thanks

I have set up a simple tween and I get no errors in the console but my circle doesn't move.

var Circle = new lib.circle();

var clickHandler = tween.bind(this);
this.btn.addEventListener("click", clickHandler);
   
function tween()
{ 
   createjs.Tween.get(Circle)
    //.wait(500)
	//.to({alpha:0, visible:false}, 1000)
	//.to({x:400}, 1000)
    //.call(handleComplete);
	console.log("tween() was called")
	
	//use he override parameter so we don't have to remove the eventlistener. Note that the parameter goes with the object called
	createjs.Tween.get(Circle, {override:true})
	.call(handleComplete)
	.to({x:100});
}

function handleComplete()
{ 
	console.log("handle complete called")
}

 

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Apr 04, 2021 Apr 04, 2021

Copy link to clipboard

Copied

Nope - I got an email re: Did it solve your problem?

But no. I'm afraid I can't find the solution. Surely it's just a misplaced coma or something. I have tried.

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines