This example uses just the Zigo Engine and FuseItem object syntax to scale up a clip with an elastic tween. Nothing too flashy, but it is a simple example of using object syntax.
[kml_flashembed movie=”/wp-content/uploads/fuse/Scale-Tween.swf” width=”700″ height=”300″ /]
Here is the code:
[as]
/*****************************************************************************
=============================================================================
EXAMPLE FILE:
Scale a box up 300 percent with an elastic tween.
=============================================================================
EXAMPLE CREDIT:
Ryan Potter
www.ThoughtWillRise.com
License: Same as Fuse.
=============================================================================
FUSE CREDIT:
Fuse Kit 2
Copyright (c) 2006 Moses Gunesch, MosesSupposes.com
Distributed under MIT Open Source License, see Fuse-Kit-License.html (in fuse package directory)
Easing Equations (c) 2003 Robert Penner used by permission, see PennerEasing
Visit http://www.mosessupposes.com/Fuse
=============================================================================
EXPLANATION:
Load in the Fuse classes.
Register FuseItem for object syntax and Penner’s easing equations.
Draw a box on the stage.
When you click the start button the box scales up to 300 percent using an elastic tween.
=============================================================================
*****************************************************************************/
// IMPORT THE CLASSES
import com.mosesSupposes.fuse.*;
init();
function init(){
ZigoEngine.register(FuseItem, PennerEasing);
this.drawStartButton();
this.drawResetButton();
this.box = this.drawClip(this, “box”, this.getNextHighestDepth(), 50, 50, 0xFFCC00);
this.box._x = 250;
this.box._y = 100;
}
function tweenIt(){
ZigoEngine.doTween({target:this.box, xscale:300, yscale:300, ease:”easeOutElastic”, seconds:3});
}
function drawStartButton(){
this.startBtn = this.drawClip(this, “box”, this.getNextHighestDepth(), 20, 20, 0xffffff);
this.startBtn._x = 10;
this.startBtn._y = 10;
this.drawLabel(this.startBtn, “Start Animation”, 25, 0);
this.startBtn.onRelease = function(){ this._parent.tweenIt(); }
}
function drawResetButton(){
this.resetBtn = this.drawClip(this, “box”, this.getNextHighestDepth(), 20, 20, 0xffffff);
this.resetBtn._x = this.startBtn._x+this.startBtn._width+10;
this.resetBtn._y = this.startBtn._y;
this.drawLabel(this.resetBtn, “Reset Animation”, 25, 0);
this.resetBtn.onRelease = function(){
ZigoEngine.removeTween(this._parent.box);
this._parent.box._xscale = 100;
this._parent.box._yscale = 100;
}
}
function drawClip(target, clip, depth, w, h, color){
var c = target.createEmptyMovieClip(clip+depth, depth);
c.beginFill(color, 100);
c.moveTo(0,0);
c.lineTo(w,0);
c.lineTo(w,h);
c.lineTo(0,h);
c.lineTo(0,0);
c.endFill();
return c;
}
function drawLabel(target, text, x, y){
target.createTextField(”tf”, target.getNextHighestDepth(), x, y, 10, 10 );
target.tf.autoSize = true;
target.tf.multiline = false;
target.tf.wordWrap = false;
target.tf.text = text;
var my_fmt:TextFormat = new TextFormat();
my_fmt.bold = true;
my_fmt.color = 0xffffff;
my_fmt.font = “_sans”;
target.tf.setTextFormat(my_fmt);
}
[/as]
2 Comments
Hi,
Is it possible to tween the button to the left with Fuse?
Kind regards,
Jan
Sure. You can tween pretty much any property on any object with Fuse.
Post a Comment